UISegmentedControl - Changing Colors and Size - Not working Right

Question

I want to be able to Change the Colors and font size of the Segments of a UISegmentedControl. I'm setting the tag for each segment and then setting the tintColor: forTag: for each of the segments.

Changing the Colors works great, till I pan the control or Pinch it. In the UIPinchGestureRecognizer code I set the titleTextAttributes to have a different Font Size. When I do this, the Colors of the Segments revert back to the default Gary Color.

- (void)createElement {
if (multiStateControl == nil) {

        //Make our new switch
        //multiStateControl = [UIButton  buttonWithType:UIButtonTypeCustom];

    multiStateControl = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:@"Off State Button", @"On State Button", nil]];

     multiStateControl.segmentedControlStyle = UISegmentedControlStyleBar;

    [multiStateControl setTitleTextAttributes:
     [NSDictionary dictionaryWithObjectsAndKeys:
      [UIFont boldSystemFontOfSize:12.0f], UITextAttributeFont, 

      nil] 
                                     forState:UIControlStateNormal]; 

     [multiStateControl setFrame:CGRectMake(0.0f, 0.0f, 100.0f, 30.0f)];

        // Set up the Contents Frame to the same origin as what we were but set the height/width to the new control.
    [elementViewContents setFrame:CGRectMake(elementViewContents.frame.origin.x, 
                                             elementViewContents.frame.origin.y, 
                                             CGRectGetWidth(multiStateControl.frame), 
                                             CGRectGetHeight(multiStateControl.frame))];


        //Set initial use to disabled
    [multiStateControl setOpaque:NO];
        // Set the default title for the button
            [multiStateControl setTag:kTagOffState forSegmentAtIndex:0];
            [multiStateControl setTag:kTagOnState forSegmentAtIndex:1];
            [multiStateControl setTintColor:onColor forTag:kTagOnState];
        [multiStateControl setTintColor:offColor forTag:kTagOffState];  

        // Lets get it on the screen
    [elementViewContents addSubview:multiStateControl];
   [multiStateControl release];

    [self contentSizeChanged];
}       
}

//Pinch Gesture

-(void) pinchElement:(UIPinchGestureRecognizer *)gestureRecognizer  {

    UIFont *existingFont = [[multiStateControl titleTextAttributesForState:UIControlStateNormal] objectForKey:UITextAttributeFont];

    CGFloat existingFontSize = [existingFont pointSize];
    CGFloat newFontSize = existingFontSize * [gestureRecognizer scale] ;

    [multiStateControl setTitleTextAttributes:
          [NSDictionary dictionaryWithObjectsAndKeys:
          [UIFont boldSystemFontOfSize:newFontSize],
          UITextAttributeFont, nil] 
                                     forState:UIControlStateNormal]; 

    [multiStateControl setFrame:CGRectMake(multiStateControl.frame.origin.x, multiStateControl.frame.origin.y, multiStateControl.frame.size.width+20,newFontSize *1.8)];
}

Answer 1

This seems to happen when I don't set the TintColor and then increase the font size of the textAttributes. It's like the default color is using some standard image for the end caps. When I increase the font, the control grows, then the ends looks stretched. A coworker mentioned the end caps like on a button. It looks like the end apps are stretched to fit the new control size.

My work around was to set the TintColor to a color that is close to the default color, doing this created a new on the fly end cap image (I'm guessing) and all the font scaling works great.