在iOS界面开发时,经常会将某一个视图进行旋转,旋转时会发现图片边缘出现了很多锯齿。即使把layer的edgeAntialiasingMask属性设置了依然会有锯齿。如何才能消除锯齿呢?如果你仔细,你会发现那些边缘虚化(透明)的图片在旋转时并不会出现锯齿。那么如果我们把这些图片的边缘透明化,会不会解决这个问题呢?
我取了一个图片,不进行任何处理,然后让它旋转0.1弧度:

image

可见确实出现了很多锯齿。
我在图片边缘加了一个像素的透明区域,代码如下:

1
2
3
4
5
6
7
- (UIImage*)antialiasedImageOfSize:(CGSize)size scale:(CGFloat)scale{
UIGraphicsBeginImageContextWithOptions(size, NO, scale);
[self drawInRect:CGRectMake(1, 1, size.width-2, size.height-2)];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
}

结果完全实现了抗锯齿效果:

image

结论

Layer的edgeAntialiasingMask属性并不能有效抗锯齿,只需要在图片边缘加入1个像素的透明区域就可以完美实现图片抗锯齿了。

我把这些代码发布在我的开源项目中了,里面有Demo。项目地址是:ImageAntialiase