本文将演示如何使用CGBlendMode改变UIImage颜色,实现对图片进行混合着色。
在项目文件夹【DemoApp】上点击鼠标右键
->【New File】创建一个扩展文件->模板选择窗口:【Swift File】->【Next】
->【Save As】:ExtensionUIImage.swift->保存默认的存储位置点击【Create】
在【ExtensionUIImage.swift】添加一个针对UIImage类的扩展。
扩展可以向一个已有的类、结构体或枚举类型添加新功能,
包括在没有获取源代码的情况下,对类型进行功能扩展。
点击编辑代码文件【ExtensionUIImage.swift】
1 import UIKit 2 3 extension UIImage 4 { 5 //添加一个扩展方法,包括的参数: 6 //1.混合颜色 7 //2.混合模式 8 //并返回一个渲染后的图片 9 func blendColor(_ color: UIColor, blendMode: CGBlendMode) -> UIImage 10 { 11 //创建一个位置在(0,0),尺寸与原始图片相同的显示区域 12 let rect = CGRect(x: 0.0, y: 0.0, width: size.width, height: size.height) 13 14 //创建一个基于位图的图形上下文, 15 //并分别设置上下文的尺寸、是否支持不透明度、以及缩放比例等信息。 16 //如果缩放比例为0,则按屏幕宽高比进行缩放。 17 UIGraphicsBeginImageContextWithOptions(size, false, scale) 18 //在上文中,设置填充颜色 19 color.setFill() 20 //使用填充颜色,填充目标区域 21 UIRectFill(rect) 22 //将源图片,以完全不透明的方式,写入目标区域, 23 //并使用指定的混合模式 24 draw(in: rect, blendMode: blendMode, alpha: 1.0) 25 26 //从上下文中,获得最后熏染的图片 27 let blendedImage = UIGraphicsGetImageFromCurrentImageContext() 28 //关闭图形上下文环境,及时释放资源 29 UIGraphicsEndImageContext() 30 31 //返回最终渲染结果 32 return blendedImage! 33 } 34 }
在项目导航区,打开视图控制器的代码文件【ViewController.swift】
现在调用上文的扩展方法,实现对图片进行混合着色的功能。
1 import UIKit 2 3 class ViewController: UIViewController { 4 5 override func viewDidLoad() { 6 super.viewDidLoad() 7 // Do any additional setup after loading the view, typically from a nib. 8 9 //创建一个图像视图,并设置其位置在(128,80),尺寸为(64,64). 10 //这个图像视图,将用来显示图片的原始效果。 11 let originalImage = UIImageView(frame: CGRect(x: 128, y: 80, width: 64, height: 64)) 12 //从资源文件夹中,加载一张图片,并赋予图像视图。 13 originalImage.image = UIImage(named: "star") 14 //将图像视图,添加到当前视图控制器的根视图 15 self.view.addSubview(originalImage) 16 17 //创建第二个图像视图,并设置其位置在(128,80),尺寸为(64,64). 18 //这个图像视图,将用来显示与黄色进行混合后的图片 19 let brownOne = UIImageView(frame: CGRect(x: 128, y: 180, width: 64, height: 64)) 20 //调用扩展方法,获得图像与黄色进行混合后的图像, 21 //混合模式为目标模式,即结果等于目标色与原色透明度的合成。 22 brownOne.image = UIImage(named: "star")?.blendColor(UIColor.yellow, blendMode: CGBlendMode.destinationIn) 23 //将第二个图像视图,添加到当前视图控制器的根视图。 24 self.view.addSubview(brownOne) 25 26 //创建第三个视图 27 let redOne = UIImageView(frame: CGRect(x: 128, y: 280, width: 64, height: 64)) 28 //调用扩展方法,获得图像与红色进行混合后的图像, 29 //混合模式为目标模式,即结果等于目标色与原色透明度的合成。 30 redOne.image = UIImage(named: "star")?.blendColor(UIColor.red, blendMode: CGBlendMode.destinationIn) 31 //将第三个图像视图,添加到当前视图控制器的根视图。 32 self.view.addSubview(redOne) 33 34 //创建第四个视图 35 let greenOne = UIImageView(frame: CGRect(x: 128, y: 380, width: 64, height: 64)) 36 //调用扩展方法,获得图像与绿色进行混合后的图像, 37 //混合模式为目标模式,即结果等于目标色与原色透明度的合成。 38 greenOne.image = UIImage(named: "star")?.blendColor(UIColor.green, blendMode: CGBlendMode.destinationIn) 39 //将第四个图像视图,添加到当前视图控制器的根视图。 40 self.view.addSubview(greenOne) 41 } 42 43 override func didReceiveMemoryWarning() { 44 super.didReceiveMemoryWarning() 45 // Dispose of any resources that can be recreated. 46 } 47 }
观察原始图像分别和三个色彩混合图像之间的区别。