Tuesday, February 21, 2012

iOS Custom UISwitch

On an iOS project we had the need to provide a custom UISwitch similar to the following.



With iOSS 5 there is quite a bit of support for interface customization. It's great for customizing almost every control in iOS, except... UISwitch. The only thing customizable with UISwitch is the tint color, which is pretty limited. So, iOS 5 is out for supporting this customization.

Next, we looked at several existing open source projects. There are several out there that support a customized look and feel, but none of these had the "feel" of the built in UISwitch control from Apple. Some would allow dragging, and some just clicking, but none allowed both a click and drag interaction.

There was a strong desire for the switch to behave just like the standard UISwitch that supports both a click and drag interaction. That led us to create our own. We were able to support the look and feel and mimic the behavior of UISwitch by implementing a custom drawRect as well as a custom touch handling. Check the Open Source implementation.

LolayUISwitch.h
LolayUISwitch.m

Next, we hope to extend this to support setting the "on" value with animation, and additionally adding in support for all the autoscale settings of iOS on a UIControl. Also, thoughts of supporting a UIView rather than just a UIImage.