UISwitch in iOS 7 showing a border

Question

I have a UISwitch whose functionality is working fine. I have 2 images of size 77 x 27 pixels and applying them for ON and OFF images.

But, its showing a stretched border in IOS 7 as seen in the images below:

Image showing a stretched border, Background colour is white

Image showing fine, Background colour is black

I have tried the following code :

_switcherTheme = [[UISwitch alloc] initWithFrame:switchRect];
_switcherTheme.backgroundColor = [UIColor colorWithRed:36.0/255.0 green:41.0/255.0 blue:45.0/255.0 alpha:1.0];
_switcherTheme.layer.cornerRadius = 16.0;
[_switcherTheme setOnTintColor:[UIColor colorWithRed:223.0/255.0 green:245.0/255.0 blue:241.0/255.0 alpha:1.0]];
if ([[[UIDevice currentDevice] systemVersion] floatValue] < 7.0) {
    [_switcherTheme setOnImage:[UIImage imageNamed:@"color_light.png"]];
    [_switcherTheme setOffImage:[UIImage imageNamed:@"color.png"]];
}

My question is : How to make this border correct for 1st image ?

Answer 1

Why are you not using these properties?

• onTintColor https://developer.apple.com/library/ios/documentation/uikit/reference/UISwitch_Class/Reference/Reference.html#//apple_ref/occ/instp/UISwitch/onTintColor
• tintColor https://developer.apple.com/library/ios/documentation/uikit/reference/UISwitch_Class/Reference/Reference.html#//apple_ref/occ/instp/UISwitch/tintColor

Answer 2

UISwitch *mySwitch = [[UISwitch alloc] initWithFrame:CGRectMake(0.0, 0.0, 51.0, 31.0)];
mySwitch.backgroundColor = [UIColor greenColor];
mySwitch.layer.cornerRadius = 16.0; // you must import QuartzCore to do this.
[self addSubview:mySwitch];