Alternate UISwitch Colors

October 14, 2009 by Skylar
Filed under: Quick Tip, iPhone Development 

Once again, Apple has another quite nice method in their bag of UIKit tricks that they don’t want developers using for some reason. The alternate colored UISwitch. This is often used to catch the user’s attention and make them take note. Look at the “Airplane Mode” switch, for an example. Or, the following screenshot:

As you can see, the switches look great. Why shouldn’t we be allowed to use them? I mean, it is as easy as adding one line of code to your standard UISwitch setup. That means, to create a switch with the orange color, you have to do this:

UISwitch *aSwitch = [[UISwitch alloc] initWithFrame:someRectangle]; [aSwitch setAlternateColors:YES]; //Do something with aSwitch [aSwitch release];

This is all you have to do. Ridiculous, isn’t it? Apple may actually reject your application for using that. The reason I’m writing up this post is to alert you to my favorite usage of the alternate colored switch.

When I’m creating an application that has options, I create all switches with the alternate color by default. When the UI is finished, or close enough, and I finishing adding methods to be performed by my switches, I let the switch use its standard colors. This lets me see at a glance which switches I’ve made work and which ones I still need to work on.

Of course, using undocumented API will give you warnings. If you’re anything like me, you hate warnings, even if you know they’re okay. To fix this warning, just add a dummy category to UISwitch that does nothing but declare the method. You can put this interface either in the header for your current object, or in a global file. Whatever works best for your application.

@interface UISwitch (UndocumentedAdditions) - (void)setAlternateColors:(BOOL)alternateColors; @end

Comments

3 Comments on Alternate UISwitch Colors

  1. Duane Homick on Fri, 13th Nov 2009 6:21 am
  2. Take a look at the custom UISwitch control that I built to allow me to change the background color of the control. You could use the same method to change the text, the font, or the text color very easily.

    http://www.homick.com/posts/custom-uiswitch-control

    The code is available on Github and includes a PSD that is used to build three different png files that the control uses. You can modify the contents of the psd to recreate the png files in whatever format you like. Swap those into the control and away you go.

  3. Skylar on Sun, 15th Nov 2009 8:18 pm
  4. When it comes down to it, a UISwitch is really just a UISlider.

    I didn’t have time to take a look at your code, I’ll do that another day. I don’t actually knnow what you’re doing, but I’d imagine just switching out the left track and right track images should customize the slider quite nicely. If you want to change the labels on the switch, I’d imagine the easiest way would be to simply create a new UISlider category that has methods to change the labels. It shouldn’t be more than a few lines max.

    [WORDPRESS HASHCASH] The poster sent us ‘0 which is not a hashcash value.

  5. fast on Tue, 6th Apr 2010 10:10 am
  6. can you send me the source code of this your tutorial app?

Tell me what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!





Powered by WP Hashcash