最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
ios开发Swift实现图片(UIImage)的水平翻转(镜像),垂直翻转
时间:2022-11-14 22:16:55 编辑:袖梨 来源:一聚教程网
有时候我们需要对图片(UIImage)进行垂直翻转(上下翻转),或者水平翻转处理(即镜像处理)。如下图:
通常有两种方式。
方法一,更改图片方向
1,实现原理
UIImage 有个属性叫 imageOrientation,它是一个枚举变量。主要作用是控制image的绘制方向,共有以下8种方向:
enum UIImageOrientation : Int {
case Up //0:默认方向
case Down //1:180°旋转
case Left //2:逆时针旋转90°
case Right //3:顺时针旋转90°
case UpMirrored //4:水平翻转
case DownMirrored //5:水平翻转
case LeftMirrored //6:垂直翻转
case RightMirrored //7:垂直翻转
}
那么我们只需要通过改变 UIImage 的 orientation,这样图片显示出来的时候,图片容器会根据新的这个 orientation 属性进行显示。从而实现水平翻转或者垂直翻转。
2,水平翻转(即左右镜像)
//原始图片
let srcImage = UIImage(named: "hangge.png")!
//翻转图片的方向
let flipImageOrientation = (srcImage.imageOrientation.rawValue + 4) % 8
//翻转图片
let flipImage = UIImage(CGImage:srcImage.CGImage!,
scale:srcImage.scale,
orientation:UIImageOrientation(rawValue: flipImageOrientation)!
)
//图片显示
imageView.image = flipImage
3,垂直翻转
//原始图片
let srcImage = UIImage(named: "hangge.png")!
//翻转图片的方向
var flipImageOrientation = (srcImage.imageOrientation.rawValue + 4) % 8
flipImageOrientation += flipImageOrientation%2==0 ? 1 : -1
//翻转图片
let flipImage = UIImage(CGImage:srcImage.CGImage!,
scale:srcImage.scale,
orientation:UIImageOrientation(rawValue: flipImageOrientation)!
)
//图片显示
imageView.image = flipImage
方法二,通过Quartz重绘图片,改变原始图片数据
1,实现原理
方法1是通过改变 UIImage 的 orientation 实现翻转的,也就是说它只是改变了一个标记而已。
它内部的图片数据其实还是原始的数据,如果翻转图片不是用来显示,而是需要用于图像识别、图像处理等操作那上面那个方法就不适合了。
本方法是将 UIImage 的图片原始数据数组进行重排,从而实现翻转。其实现的关键点是在Core Graphics(Quartz)层面上重绘图片。
2,水平翻转(即左右镜像)
由于Core Graphics(Quartz) 与 UIKit 的y轴坐标系是相反的,先绕原点旋转180度,再平移一下就好了
//原始图片
let srcImage = UIImage(named: "hangge.png")!
//Quartz重绘图片
let rect = CGRectMake(0, 0, srcImage.size.width , srcImage.size.height);//创建矩形框
//根据size大小创建一个基于位图的图形上下文
UIGraphicsBeginImageContextWithOptions(rect.size, false, 2)
let currentContext = UIGraphicsGetCurrentContext();//获取当前quartz 2d绘图环境
CGContextClipToRect(currentContext, rect);//设置当前绘图环境到矩形框
CGContextRotateCTM(currentContext, CGFloat(M_PI)); //旋转180度
//平移, 这里是平移坐标系,跟平移图形是一个道理
CGContextTranslateCTM(currentContext, -rect.size.width, -rect.size.height);
CGContextDrawImage(currentContext, rect, srcImage.CGImage);//绘图
//翻转图片
let drawImage = UIGraphicsGetImageFromCurrentImageContext();//获得图片
let flipImage = UIImage(CGImage:drawImage.CGImage!,
scale:srcImage.scale,
orientation:srcImage.imageOrientation //图片方向不用改
)
//图片显示
imageView.image = flipImage
3,垂直翻转
垂直翻转更简单了。由于 Core Graphics(Quartz) 与 UIKit 的y轴坐标系是相反的,UIKit是y轴向下,Quartz是y轴向上。直接绘制就是垂直翻转的。
//原始图片
let srcImage = UIImage(named: "hangge.png")!
//Quartz重绘图片
let rect = CGRectMake(0, 0, srcImage.size.width , srcImage.size.height);//创建矩形框
//根据size大小创建一个基于位图的图形上下文
UIGraphicsBeginImageContextWithOptions(rect.size, false, 2)
let currentContext = UIGraphicsGetCurrentContext();//获取当前quartz 2d绘图环境
CGContextClipToRect(currentContext, rect);//设置当前绘图环境到矩形框
CGContextDrawImage(currentContext, rect, srcImage.CGImage);//绘图
//翻转图片
let drawImage = UIGraphicsGetImageFromCurrentImageContext();//获得图片
let flipImage = UIImage(CGImage:drawImage.CGImage!,
scale:srcImage.scale,
orientation:srcImage.imageOrientation //图片方向不用改
)
//图片显示
imageView.image = flipImage
注:如何防止由于图片重绘造成显示模糊
由于使用视网膜屏,我的原始图片是 [email protected]。如果使用第二方法,即通过重绘来实现图片翻转并显示出来。那么在创建图形上下文的时候就需要设置好放大倍数。而不能简单地直接 UIGraphicsBeginImageContext(rect.size) 来创建。
//根据size大小创建一个基于位图的图形上下文
UIGraphicsBeginImageContextWithOptions(rect.size, false, 2)
相关文章
- 《潜行者2:切尔诺贝利之心》使用手电筒方法介绍 11-21
- 《潜行者2:切尔诺贝利之心》回声探测器使用攻略分享 11-21
- 《潜行者2:切尔诺贝利之心》人工制品奖励获得方法介绍 11-21
- 《潜行者2:切尔诺贝利之心》奇美拉嵌合体打法技巧分享 11-21
- 《潜行者2:切尔诺贝利之心》风衣怪打法技巧分享 11-21
- 《潜行者2:切尔诺贝利之心》变异狗打法技巧分享 11-21