Icon AND Text in UISegmentedController

Question

A segment can only have an image or a title; it can’t have both. There is no default image.

So says Apple in the UISegmentedController Reference.

Has anyone come up with a generalized solution that allows you to have both an icon and text? I have a Segmented Control that has four segments. There are options for customizing the appearance of the control, but they only seem designed for a UISegmentedControl with two segments?

Ideas I'm kicking around:

1. Ditch the segmented control for four UIButtons and handle the "selected" state myself
2. Throw my hands up just go with text or icons.
3. Your suggestions...?

Answer 1

You create a new image by drawing your current image into a context, draw the text you want,then use that combo image as the single segment image:

UIGraphicsBeginImageContextWithOptions(size, YES, 0);
CGContextRef context = UIGraphicsGetCurrentContext();

// Text first
[myString drawAtPoint:somePoint withFont:font];

// Images upside down so flip them 
CGAffineTransform flipVertical = CGAffineTransformMake(1, 0, 0, -1, 0, size.height);
CGContextConcatCTM(context, flipVertical);
CGContextDrawImage(context, (CGRect){ imagePoint, imageSize }, [myUIimage CGImage]);

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

return image;

Answer 2

You may want to try a third-party alternative such as STSegmentedControl (No relation, but I've used it, and it sounds like it will give you the flexibility you need without starting from scratch).