How can I create a template image to be colored at run time

Question

I have an image that is an almost flat color. It's attached but, plain white so you can't see it easily.

I would like to be able to dynamically color this image at runtime, but I need to do it in iOS 6 without using UIImageRenderingModeAlwaysTemplate.

The images will all start plain white with minor gradients for rounded corners.

So far my best attempt has been using GPUImage and a category on UIImage

@implementation UIImage (BPAdditions)

- (UIImage *)imageWithColor:(UIColor *)color
{

    GPUImageRGBFilter *stillImageFilter = [[GPUImageRGBFilter alloc] init];
    CGFloat red = 0.0, green = 0.0, blue = 0.0, alpha =0.0;
    [color getRed:&red green:&green blue:&blue alpha:&alpha];
    stillImageFilter.red = red;
    stillImageFilter.green = green;
    stillImageFilter.blue = blue;
    GPUImageChromaKeyFilter *stillImageFilter2 = [[GPUImageChromaKeyFilter alloc] init];
    [stillImageFilter2 setColorToReplaceRed:0 green:0 blue:0];
    stillImageFilter2.thresholdSensitivity = 0.2;
    stillImageFilter2.smoothing = 0;
    UIImage *img = [stillImageFilter imageByFilteringImage:self];

    return [stillImageFilter2 imageByFilteringImage: img];
}

This would be ideal, except when I used the RGB filter it turns the clear background black. Then removing this with the chroma filter has varying quality depending on the color used.

There is a possibility that the target color will be black, in which case this solution will fail entirely.

Answer 1

Not sure if I understand what you're trying to achieve, but do you want to add a simple color tint to the base image? If so, you can achieve this with the following category on UIImage:

- (UIImage *)tintWithColor:(UIColor *)tintColor {
    UIGraphicsBeginImageContextWithOptions(self.size, NO, [[UIScreen mainScreen] scale]);
    CGRect drawRect = CGRectMake(0, 0, self.size.width, self.size.height);
    [self drawInRect:drawRect];
    [tintColor set];
    UIRectFillUsingBlendMode(drawRect, kCGBlendModeSourceAtop);
    UIImage *tintedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return tintedImage;
}

-- Update: Swift 2 version --

extension UIImage {

    func tintWithColor(color:UIColor) -> UIImage {
        UIGraphicsBeginImageContextWithOptions(self.size, false, UIScreen.mainScreen().scale)

        let rect = CGRectMake(0, 0, self.size.width, self.size.height)
        self.drawInRect(rect)
        color.setFill()
        UIRectFillUsingBlendMode(rect, CGBlendMode.SourceAtop)

        let newImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return newImage
    }

}