iOS 6 : UISwitch Updates To Support Tint And Images

With iOS 6 you can now set a few additional properties on UISwitch controls, including tint, thumbtint, and the on and off images.

Here’s how the traditional switch options look:

To change the tint color:

// Create UISwitch
UISwitch    *saveStateSwitch;
 
...
 
saveStateSwitch = [[UISwitch alloc] initWithFrame:CGRectMake(122, 20, 0, 0)];
 
// Set the tint color when off
[saveStateSwitch setTintColor: [UIColor colorWithRed:0.667 green:0.610 blue:0.035 
   alpha:1.000]];

The new control now looks as follows:

The switch looks a little bizarre with the new tint color – when the switch is On notice that the thumb tint color is set to the tint color if not specified.

To get a more consistent color scheme, here is how you can set the on, off and thumb tint:

// Create thumb tint to match on/off colors
[saveStateSwitch setThumbTintColor: [UIColor colorWithRed:0.933 green:0.898 blue:0.511 
   alpha:1.000]];
 
// Set on/off image
[saveStateSwitch setOffImage:[UIImage imageNamed:@"off.png"]];
[saveStateSwitch setOnImage:[UIImage imageNamed:@"on.png"]];

Obviously it would be helpful to add text to your images specifying the values for the switches (on/off, yes/no, etc).

  1. Finally! I have had users request this for years. It’s too bad the text still can’t be set directly instead of using images.

Comments are closed.