UISegmentedControl selected segment color

Mike picture Mike · Feb 16, 2010 · Viewed 95k times · Source

Is there any way to customize color of selected segment in UISegmentedControl?

I've found segmentedController.tintColor property, which lets me customize color of the whole segmented control. The problem is, when I select bright color for tintColor property, selected segment becomes almost unrecognizable (its color is almost the same as the rest of segmented control, so its hard to distinguish selected and unselected segments). So I cannot use any good bright colors for segmented control. The solution would be some separate property for selected segment color but I cannot find it. Did anyone solve this?

Answer

whitneyland picture whitneyland · May 9, 2011

Here is the absolute simplest way to change the selected segment to any RGB color. No subclassing or hacks required.

segmentedControl.segmentedControlStyle = UISegmentedControlStyleBar;

UIColor *newTintColor = [UIColor colorWithRed: 251/255.0 green:175/255.0 blue:93/255.0 alpha:1.0];
    segmentedControl.tintColor = newTintColor;

UIColor *newSelectedTintColor = [UIColor colorWithRed: 0/255.0 green:175/255.0 blue:0/255.0 alpha:1.0];
[[[segmentedControl subviews] objectAtIndex:0] setTintColor:newSelectedTintColor];

This example shows the important steps:

  1. Sets the control style to "StyleBar", which is required for it to work
  2. Sets the un-selected color for the entire control first to orange
  3. Sets the color of the selected segment to green

Notes:

  • Steps 1 and 2 can be done in interface builder, or in code as shown. However step 3 can only be done in code
  • The color values being set with notation like this "123.0/255.0" is just a way to make the RGB values stand out instead the normalized float values required by UIColor (just ignore it if you like)