UIImage+BlendMode

现状：

在iOS5和6的SDK里部分标准控件引入了tintColor，来满足个性化界面的需求，但是Apple在这方面还远远做的不够。一是现在用默认控件根本难以做出界面优秀的应用，二是tintColor所覆盖的并不够全面，在很多情况下开发者都无法使用其来完成个性化定义。

存在问题：

自定义主题界面，设计师重复地修改图片，开发者图片文件重命名、移动和导入无用功较多，下载安装包较大。

解决方案：

我们将用blending给这张图片加上另一个纯色作为tint，并保持原来的alpha通道，然后结合Core Graphics 。如下：

1. 创建一个上下文用以画新的图片
2. 将新的tintColor设置为填充颜色
3. 将原图片画在创建的上下文中，并用新的填充色着色（注意保持alpha通道）
4. 从当前上下文中取得图片并返回

UIImage的类别

UIImage+Tint.h

#import <UIKit/UIKit.h>

@interface UIImage (Tint)
- (UIImage *) imageWithTintColor:(UIColor *)tintColor blendMode:(CGBlendMode)blendMode;
@end

UIImage+Tint.m

#import "UIImage+Tint.h"
@implementation UIImage (Tint)
- (UIImage *) imageWithTintColor:(UIColor *)tintColor blendMode:(CGBlendMode)blendMode
{
    UIGraphicsBeginImageContextWithOptions(self.size, NO, 0.0f);
    [tintColor setFill];//填充颜⾊色
    CGRect bounds = CGRectMake(0, 0, self.size.width, self.size.height);
    UIRectFill(bounds);
    //设置绘画透明混合模式和透明度
    [self drawInRect:bounds blendMode:blendMode alpha:1.0f];
    if (blendMode == kCGBlendModeOverlay) {
        //保留透明度信息
        [self drawInRect:bounds blendMode:kCGBlendModeDestinationIn alpha:1.0f];
    }
    UIImage *tintedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return tintedImage;
}
@end

ViewController.m

#import "ViewController.h"
#import "UIImage+Tint.h"
@interface ViewController ()
@property (strong, nonatomic) UIImageView *imgVBlend;
@property (strong, nonatomic) UILabel *lblMsg;
@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    [self layoutUI];
}
- (void)layoutUI {
    
    CGPoint newPoint = self.view.center;
    _imgVBlend = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"xx"]];
    _imgVBlend.center = newPoint;
    _imgVBlend.userInteractionEnabled = YES;
    UITapGestureRecognizer *gesture = [[UITapGestureRecognizer alloc] initWithTarget:self
                                                                              action:@selector(changeBlendMode:)];
    gesture.numberOfTouchesRequired = 1;
    gesture.numberOfTapsRequired = 1;
    [_imgVBlend addGestureRecognizer:gesture];
    [self.view addSubview:_imgVBlend];

    _lblMsg = [[UILabel alloc] initWithFrame:CGRectMake(20, CGRectGetMaxY(_imgVBlend.frame), self.view.frame.size.width - 40, 120)];
    _lblMsg.numberOfLines = 0;
    _lblMsg.text = @"在屏幕中绘图时设置透明度；点击图片切换为混合模式绘制的图片";
    _lblMsg.textAlignment = NSTextAlignmentLeft;
    _lblMsg.textColor = [UIColor blackColor];
    _lblMsg.layer.borderColor = [UIColor grayColor].CGColor;
    _lblMsg.layer.borderWidth = 1.0;
    [self.view addSubview:_lblMsg];
}

- (void)changeBlendMode:(UIGestureRecognizer*)gesture {
    
    static CGBlendMode blendMode = kCGBlendModeNormal;
    NSString *strMsg;
    switch (blendMode) {
        case kCGBlendModeNormal: {
            strMsg = @"kCGBlendModeNormal: 正常；也是默认的模式。前景图会覆盖背景图";
            break;
        }
        case kCGBlendModeMultiply: {
            strMsg = @"kCGBlendModeMultiply: 正片叠底；混合了前景和背景的颜色，最终颜色比原先的都暗";
            break;
        }
        case kCGBlendModeScreen: {
            strMsg = @"kCGBlendModeScreen: 滤色；把前景和背景图的颜色先反过来，然后混合";
            break;
        }
        case kCGBlendModeOverlay: {
            strMsg = @"kCGBlendModeOverlay: 覆盖；能保留灰度信息，结合kCGBlendModeSaturation能保留透明度信息，在imageWithBlendMode方法中两次执行drawInRect方法实现我们基本需求";
            break;
        }
        case kCGBlendModeDarken: {
            strMsg = @"kCGBlendModeDarken: 变暗";
            break;
        }
        case kCGBlendModeLighten: {
            strMsg = @"kCGBlendModeLighten: 变亮";
            break;
        }
        case kCGBlendModeColorDodge: {
            strMsg = @"kCGBlendModeColorDodge: 颜色变淡";
            break;
        }
        case kCGBlendModeColorBurn: {
            strMsg = @"kCGBlendModeColorBurn: 颜色加深";
            break;
        }
        case kCGBlendModeSoftLight: {
            strMsg = @"kCGBlendModeSoftLight: 柔光";
            break;
        }
        case kCGBlendModeHardLight: {
            strMsg = @"kCGBlendModeHardLight: 强光";
            break;
        }
        case kCGBlendModeDifference: {
            strMsg = @"kCGBlendModeDifference: 插值";
            break;
        }
        case kCGBlendModeExclusion: {
            strMsg = @"kCGBlendModeExclusion: 排除";
            break;
        }
        case kCGBlendModeHue: {
            strMsg = @"kCGBlendModeHue: 色调";
            break;
        }
        case kCGBlendModeSaturation: {
            strMsg = @"kCGBlendModeSaturation: 饱和度";
            break;
        }
        case kCGBlendModeColor: {
            strMsg = @"kCGBlendModeColor: 颜色";
            break;
        }
        case kCGBlendModeLuminosity: {
            strMsg = @"kCGBlendModeLuminosity: 亮度";
            break;
        }
            //Apple额外定义的枚举
            //R: premultiplied result, 表示混合结果
            //S: Source, 表示源颜色(Sa对应透明度值: 0.0-1.0)
            //D: destination colors with alpha, 表示带透明度的目标颜色(Da对应透明度值: 0.0-1.0)
        case kCGBlendModeClear: {
            strMsg = @"kCGBlendModeClear: R = 0";
            break;
        }
        case kCGBlendModeCopy: {
            strMsg = @"kCGBlendModeCopy: R = S";
            break;
        }
        case kCGBlendModeSourceIn: {
            strMsg = @"kCGBlendModeSourceIn: R = S*Da";
            break;
        }
        case kCGBlendModeSourceOut: {
            strMsg = @"kCGBlendModeSourceOut: R = S*(1 - Da)";
            break;
        }
        case kCGBlendModeSourceAtop: {
            strMsg = @"kCGBlendModeSourceAtop: R = S*Da + D*(1 - Sa)";
            break;
        }
        case kCGBlendModeDestinationOver: {
            strMsg = @"kCGBlendModeDestinationOver: R = S*(1 - Da) + D";
            break;
        }
        case kCGBlendModeDestinationIn: {
            strMsg = @"kCGBlendModeDestinationIn: R = D*Sa；能保留透明度信息";
            break;
        }
        case kCGBlendModeDestinationOut: {
            strMsg = @"kCGBlendModeDestinationOut: R = D*(1 - Sa)";
            break;
        }
        case kCGBlendModeDestinationAtop: {
            strMsg = @"kCGBlendModeDestinationAtop: R = S*(1 - Da) + D*Sa";
            break;
        }
        case kCGBlendModeXOR: {
            strMsg = @"kCGBlendModeXOR: R = S*(1 - Da) + D*(1 - Sa)";
            break;
        }
        case kCGBlendModePlusDarker: {
            strMsg = @"kCGBlendModePlusDarker: R = MAX(0, (1 - D) + (1 - S))";
            break;
        }
        case kCGBlendModePlusLighter: {
            strMsg = @"kCGBlendModePlusLighter: R = MIN(1, S + D)（最后一种混合模式）";
            break;
        }
        default: {
            break;
        }
    }
    _imgVBlend.image=[[UIImage imageNamed:@"xx"] imageWithTintColor:[UIColor orangeColor] blendMode:blendMode];
    _lblMsg.text = strMsg;
    
    blendMode++;
    if (blendMode > kCGBlendModePlusLighter) {
        blendMode = kCGBlendModeNormal;
    }
}
@end

备注：

    用kCGBlendModeOverlay能保留灰度信息，用kCGBlendModeDestinationIn能保留透明度信息。

因为每次使用UIImage+Tint的方法绘图时，都使用了CG的绘制方法，这就意味着每次调用都会是用到CPU的Offscreen drawing，大量使用的话可能导致性能的问题（主要对于iPhone 3GS或之前的设备，可能同时处理大量这样的绘制调用的能力会有不足）。对于这里的UIImage+Tint的实现，可以写一套缓存的机制，来确保大量重复的元素只在load的时候blend一次，之后将其缓存在内存中以快速读取。当然这是一个权衡的问题，在时间和空间中做出正确的平衡和选择，也正是程序设计的乐趣所在。