图片变形的抗锯齿处理方法

移动开发
想起了很久以前也遇到过类似抗锯齿的问题,那时候要做一个类贴纸的应用,理所当然会遇到贴纸缩放和旋转的问题。所以锯齿的问题也是需要解决的。但是那时候是iOS4,5的时代,压根没有上面说的allowsEdgeAntialiasing这个东西(这个东西iOS7才公开,不过iOS6据说也可以用,但是黑科技嘛..你懂的)

[[148963]]

前言

周末在微博上看到@周楷雯Kevin说起CALayer抗锯齿的问题

1441074320385070.png

具体做法是:


  1. layer.allowsEdgeAntialiasing = true 

想起了很久以前也遇到过类似的问题 那时候要做一个类贴纸的应用 理所当然会遇到贴纸缩放和旋转的问题 所以锯齿的问题也是需要解决的 但是那时候是iOS4,5的时代 压根没有上面说的allowsEdgeAntialiasing这个东西(这个东西iOS7才公开 不过iOS6据说也可以用 但是黑科技嘛..你懂的)

所以当时求助了***的stackoverflow 得到了一个非常简约而不简单的方法 就是我在微博上说的 只要把需要显示的图片留一个像素的透明边 就搞定了

方法

方法比较简单 我写成了一个UIImage的Category方法 然后一直尘封在我的工具库中好几年(遇到这个问题我才想起来)


  1. - (UIImage *)antiAlias 
  2.     CGFloat border = 1.0f; 
  3.     CGRect rect = CGRectMake(border, border, self.size.width-2*border, self.size.height-2*border); 
  4.     UIImage *img = nil; 
  5.      
  6.     UIGraphicsBeginImageContext(CGSizeMake(rect.size.width,rect.size.height)); 
  7.     [self drawInRect:CGRectMake(-1, -1, self.size.width, self.size.height)]; 
  8.     img = UIGraphicsGetImageFromCurrentImageContext(); 
  9.     UIGraphicsEndImageContext(); 
  10.      
  11.     UIGraphicsBeginImageContext(self.size); 
  12.     [img drawInRect:rect]; 
  13.     UIImage* antiImage = UIGraphicsGetImageFromCurrentImageContext(); 
  14.     UIGraphicsEndImageContext(); 
  15.      
  16.     return antiImage; 

先来看看实际的效果

2.jpg

可以看到旋转的时候若不做任何处理 确实是会有明显的锯齿 而使用透明边的方法 或者设置allowsEdgeAntialiasing 都可以消除锯齿

接下来看看这两种方法的性能比较 测试方法是在我的iPhone 5S上接连对500个UIImageView进行旋转 对比帧数 其结果如下

3.jpg

结果表明 allowsEdgeAntialiasing的性能还是比透明边的方式要差一点 所以…

  • 如果你的应用要支持iOS6- 可以参考透明边的方法 唯一的缺点是显示出来会比原来小那么一点点(我的做法是直接cut掉1px的边 当然你也可以直接在图像外面加1px的透明边)

  • 如果你的应用仅支持iOS7 推荐使用allowsEdgeAntialiasing来设置 简单方便咯 如果性能上觉得吃力的话 可以再考虑透明边的方法

小结

文中的demo可以在这里找到

测试的方法也许不太严谨(也是临时起意写的这篇 所以并没有花太多时间) 如果有错误 请大家提出来

责任编辑:倪明 来源: 里脊串的开发随笔
相关推荐

2012-01-11 09:39:50

Java

2018-08-06 16:31:36

NVIDIA光线抗锯齿

2009-06-04 15:52:25

Netbeans6.5字体无法抗锯齿Ubuntu9.04

2021-08-07 07:59:20

Windows 11操作系统微软

2009-06-10 17:11:01

linux netbe反锯齿处理

2018-10-18 14:28:33

2011-08-09 15:20:38

2009-07-28 16:07:40

.NET图片快速处理

2011-02-21 16:11:45

C#.NET.NET framew

2011-09-19 10:12:32

UbuntuPhotivo

2023-10-27 08:34:46

PythonJava优势

2010-07-26 15:12:20

坐标变换

2011-03-16 11:22:16

iconDefaultiPhone

2011-05-06 09:19:48

笔记本花屏黑屏

2011-07-25 16:41:16

Sencha Touc

2010-03-09 19:19:40

Python图像处理

2018-09-21 15:15:33

NVIDIA显卡深度学习

2022-07-12 09:00:00

深度学习人工智能机器人

2018-09-07 14:32:17

NVIDIARTX 20DLSS

2017-07-13 11:44:20

Web开发CSSPC
点赞
收藏

51CTO技术栈公众号