BlendMode颜色混合模式枚举值

BlendMode参数值及表现形式

blendMode作用

在对图片进行手动处理的时候，可能用到图层混合，如改变图片的颜色。常常获取CGContext,然后设置其blendMode参数。

为了形象理解BlendMode值的变化，我使用了一张主图标和辅图标（支付宝图标）作为测试，测试颜色为红色，注释中有序号的可以对应其变换结果

BlendModel参数值结束

如下（转）：

    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"; //1.清空（如果图标背景色为白色则为全白） 
            break;  
        }  
        case kCGBlendModeCopy: {  
            strMsg = @"kCGBlendModeCopy: R = S";  //2全色覆盖整个图片
            break;  
        }  
        case kCGBlendModeSourceIn: {  
            strMsg = @"kCGBlendModeSourceIn: R = S*Da";  //3.线条变色
            break;  
        }  
        case kCGBlendModeSourceOut: {  
            strMsg = @"kCGBlendModeSourceOut: R = S*(1 - Da)";  //4.背景变为目的色,线条自动变为白色（比如图标线条原为蓝色，会自动变为白色）
            break;  
        }  
        case kCGBlendModeSourceAtop: {  
            strMsg = @"kCGBlendModeSourceAtop: R = S*Da + D*(1 - Sa)";   //5.线条变色，目前感觉和SourceIn效果一致
            break;  
        }  
        case kCGBlendModeDestinationOver: {  
            strMsg = @"kCGBlendModeDestinationOver: R = S*(1 - Da) + D";  //6.背景色变为目的色，线条色不变
            break;  
        }  
        case kCGBlendModeDestinationIn: {  
            strMsg = @"kCGBlendModeDestinationIn: R = D*Sa；能保留透明度信息";  //7.只看到线条色（本色），无其他颜色
            break;  
        }  

        case kCGBlendModeDestinationOut: {  
            strMsg = @"kCGBlendModeDestinationOut: R = D*(1 - Sa)";     //8.空白什么都没哟
            break;  
        }  
        case kCGBlendModeDestinationAtop: {  
            strMsg = @"kCGBlendModeDestinationAtop: R = S*(1 - Da) + D*Sa";  //9.会把整个矩形的背景填充目的色（如图9系列）原色保留
            break;  
        }  
        case kCGBlendModeXOR: {  
            strMsg = @"kCGBlendModeXOR: R = S*(1 - Da) + D*(1 - Sa)";  //10.线条变白，背景色变为目的色
            break;  
        }  
        case kCGBlendModePlusDarker: {  
            strMsg = @"kCGBlendModePlusDarker: R = MAX(0, (1 - D) + (1 - S))";  //11.线条变为黑色， 背景色变为目的色
            break;  
        }  
        case kCGBlendModePlusLighter: {  
            strMsg = @"kCGBlendModePlusLighter: R = MIN(1, S + D)（最后一种混合模式）";  //12.线条变为白色（混合色：如color为红色，就是偏粉色的白，有一定透明度的感觉）
            break;  
        }  
        default: {  
            break;  
        }  

以上中文解释(含//）是在如下代码段情况下发生的，不同代码段可能表示形式不一。

测试图标依赖下面代码，实际使用要考虑实际效果

改变图标代码参考:

func changeColor(_ color:UIColor, blendMode:CGBlendMode) -> UIImage {
        //方式一（可以）
        UIGraphicsBeginImageContextWithOptions(self.size, false, UIScreen.main.scale)
        let context = UIGraphicsGetCurrentContext()
        color.setFill()
        //移动图片
        context!.translateBy(x: 0, y: self.size.height)
        context!.scaleBy(x: 1.0, y: -1.0)
        
        let rect = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)
        context!.draw(self.cgImage!, in: rect)
        //模式配置
        context!.setBlendMode(blendMode)
        context!.addRect(rect)
        context!.drawPath(using: CGPathDrawingMode.fill)
        //创建获取图片
        let coloredImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        
        return coloredImage!}

颜色变换参考

原型图标：这里传颜色是传入的是red红色

 

3/5。

7.

9.

10

11

12（支付宝的图标有圆角处理）所以边角也有点色

这个是blendMode.Color的变换效果