UICustomSwitch - color it, change labels

[HardyMacia]

After looking for a day at how to change the blue of the UISwitch to a different color so it can match my theme in PocketMoney I ended up writing my own. This will let you change the tintColor and the labels. If you want to modify other aspect so fit to change the label to images you'll have to modify the .png files.

This code can be freely used in any kind of project as long as the copyright information stays intact. If you improve on the code then please share it back to me so I can integrate it in with my code.

- Hardy

[HardyMacia]

Update to code is attached:

• Fixed bugs with valueChanged notification
• Set the backgroundColor to clear for whole switch.

[HardyMacia]

Update to code is attached:

• Fixed the rounded corners not drawing correctly. Mask is now applied before using the blending so the alpha channel is honored.

[HardyMacia]

From Renton
E-mail : e.fortunati@yourworldinyourhands.eu

It was great!!!
just added

- (void)scaleSwitch:(CGSize)newSize {
self.transform = CGAffineTransformMakeScale(newSize.width,newSize.height);
}

to allow rescaling!

Thanks for your customSwitch!

[HardyMacia]

Two updates to the custom switch code from other developers. Thanks Simran and Renton.

Thumb.png transparency fixed.
Scale method added for resizing.

[HardyMacia]

From dejo in comments from blog post...

Here's how I enhanced it: I needed to be able to tint the off color as well (for a M/blue vs. F/pink gender switch). So I added the following method, with a supporting property as well (not shown):

Code: Select all

-(void)setOffTintColor:(UIColor*)color
{
   if (color != offTintColor)
   {
      [offTintColor release];
      offTintColor = [color retain];
      
      [self setMaximumTrackImage:[self image:[UIImage imageNamed:@"switchOffPlain.png"] tintedWithColor:offTintColor] forState:UIControlStateNormal];
   }
   
}


[alextrob]

Thanks for releasing this code; it's been pretty useful.
I've done a few little things to to make it look & behave a bit more like the standard UISwitch.

1. In the awakeFromNib method, I've added this to make the thumbImage adjust its state when it's pressed:

Code: Select all

[self setThumbImage:[UIImage imageNamed:@"switchThumbSel.png"] forState:UIControlStateHighlighted];

I've attached an example of the switchThumbSel.png based on the switchThumb.png that came with the code.

2. If you look closely at the standard UISwitch, it's got a dark shadow above the 'ON' text and a highlight below the 'OFF' text. So if you want to duplicate that for your custom switch...

Put this after self.leftLabel = [[UILabel alloc] init]; where the properties of leftLabel are being set:

Code: Select all

[self.leftLabel setShadowColor:[UIColor colorWithRed:0 green:0 blue:0 alpha:0.5]];
[self.leftLabel setShadowOffset:CGSizeMake(0, -1)];

And this after self.rightLabel = [[UILabel alloc] init];

Code: Select all

[self.rightLabel setShadowColor:[UIColor colorWithRed:1 green:1 blue:1 alpha:0.5]];
[self.leftLabel setShadowOffset:CGSizeMake(0, 1)];

[HardyMacia]

FYI, as pointed out by @PeyloW twit Apple doesn't want us using their class prefixes for custom controls. Better if you called it CSCustomSwitch or maybe CSCustom_UISwitch.