封装图片设置为圆形

在iOS开发中,我们经常会遇到把头像或者图片什么的设置为圆形
大部分人的第一思路是利用图层:让cornerRadius 等于宽度的一半
一:

self.lywimage.layer.masksToBounds = YES;
 self.lywimage.layer.cornerRadius = self.lywimage.lyw_W * 0.5;

效果图:


封装图片设置为圆形_第1张图片
Snip20160808_1.png

二:在xib 或者Storyboard中

封装图片设置为圆形_第2张图片
Snip20160808_2.png

效果图


封装图片设置为圆形_第3张图片
Snip20160808_3.png

注意:如果你是将Xib 或者Storyboard将图片拖线过去代码中,则使用第一种方式就可以设置圆角
但是这种方式都是不好的,因为这里涉及到一个性能优化的问题,
比如有很多头像之类的需要设置为圆角这样会让UITableView非常卡顿


封装图片设置为圆形_第4张图片
IMG_0677.JPG

所以我们尽量别使用这种方法

这是个面试题,很多面试官有时候会问怎么优化UITableView 
简单说一下这个面试题:
1.使用不透明视图。
2.不要重复创建不必要的table cell。
3.减少视图的数目。
4.不要做多余的绘制工作。
5.预渲染图像。
6.不要阻塞主线程。

上面给大家介绍了很多初学者使用的方法,下面给大家封装一个图片画圆
第一步:


封装图片设置为圆形_第5张图片
Snip20160808_4.png

第二步:在UIImage+EXtension.h文件中提供一个对象方法出来


封装图片设置为圆形_第6张图片
Snip20160808_5.png
- (instancetype)circleImage;

第三步:在UIImage+EXtension.m文件中用


封装图片设置为圆形_第7张图片
Snip20160808_8.png
- (instancetype)circleImage
{
    // 开启图形上下文
    UIGraphicsBeginImageContext(self.size);
    
    // 上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    // 添加一个圆
    CGRect rect = CGRectMake(0, 0, self.size.width, self.size.height);
    CGContextAddEllipseInRect(ctx, rect);
    
    // 裁剪
    CGContextClip(ctx);
    
    // 绘制图片
    [self drawInRect:rect];
    
    // 获得图片
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    
    // 关闭图形上下文
    UIGraphicsEndImageContext();
    
    return image;
}

第四步:导入头文件之后,利用这两句代码就可以实现


Snip20160808_6.png
UIImage *image = [UIImage circleImage:@"ic_launcher_xxx"];
 self.lywimage.image = [image circleImage];

效果图是一样的。给大家看一下。大家可以看时间,我上面截的图是九点多,现在截图是十一点多。


封装图片设置为圆形_第8张图片
Snip20160808_11.png

有时候我们希望直接传一个图片过去然后就画好了圆这样更方便直接,
虽然这样就可以实现

 self.lywimage.image = [[UIImage circleImage:@"ic_launcher_xxx"]  circleImage];

但是我给大家再提供一个方法出来
在UIImage+EXtension.h文件中


封装图片设置为圆形_第9张图片
Snip20160808_9.png

在UIImage+EXtension.m文件中


封装图片设置为圆形_第10张图片
Snip20160808_10.png

然后我们就可以直接使用了 这里我给大家截取出刚才的那几个画圆方法


封装图片设置为圆形_第11张图片
Snip20160808_12.png

以后大家需要实现画圆,只需要把这个扩展的类
(就是UIImage+EXtension.h,和UIImage+EXtension.m)拖进文件里面调用这提供的两个方法就可以实现画圆功能了

扩展 :如果在上面的基础上给UIImageView添加直接设置图片为圆形的方法
前提是有之前的那些步骤

封装图片设置为圆形_第12张图片
Snip20160808_14.png
封装图片设置为圆形_第13张图片
Snip20160808_15.png
封装图片设置为圆形_第14张图片
Snip20160808_18.png

使用方法


封装图片设置为圆形_第15张图片
Snip20160808_18.png

效果图


封装图片设置为圆形_第16张图片
Snip20160808_19.png

Dome:https://github.com/LYWGod/circleImage
备注:

如果有不足或者错误的地方还望各位读者批评指正,可以评论留言,笔者收到后第一时间回复。

QQ/微信:2366889552 /lan2018yingwei。

号:凡尘一笑:[]

http://www.jianshu.com/users/0158007b8d17/latest_articles

感谢各位观众老爷的阅读,如果觉得笔者写的还凑合,可以关注或收藏一下,不定期分享一些好玩的实用的demo给大家。

文/凡尘一笑(作者)

原文链接: http://www.jianshu.com/p/8ae080edb3ea

著作权归作者所有,转载请联系作者获得授权,并标注“作者”。

你可能感兴趣的:(封装图片设置为圆形)