iOS开发笔记:实现圆形头像

初学iOS,记录一下自己遇到的一些问题,也希望能够对别人有所帮助

iOS开发笔记:实现圆形头像_第1张图片
一般应用的个人头像
如上图, 圆形头像算是每款App中最常见的东西了,刚好最近有遇到这个问题,并且顺利解决了,其实很简单,调用layer这个属性即可:

    //  把图片设置成圆形。  我这里在故事版里面设置的imageView是一个正方形(因为头像图片都是放在正方形的imageView里)
    self.imageView.layer.cornerRadius=self.imageView.frame.size.width/2;//裁成圆角
    self.imageView.layer.masksToBounds=YES;//隐藏裁剪掉的部分
iOS开发笔记:实现圆形头像_第2张图片
圆形头像

仔细观察第一张图片,可以发现头像其实还有一个白色的边框,这就需要layer的另外两个属性了:

    //  给图片加一个圆形边框
    self.imageView.layer.borderWidth = 1.5f;//边框宽度
    self.imgaeView.layer.borderColor = [UIColor whiteColor].CGColor;//边框颜色
iOS开发笔记:实现圆形头像_第3张图片
有边框的圆形头像

这样,就实现了App里面的个人头像效果。

完整代码如下:

#import "ViewController.h"

@interface ViewController ()
@property (strong, nonatomic) IBOutlet UIImageView *myHeadPortrait;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    
    //  调用setHeadPortrait方法
    [self setHeadPortrait];
    
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

//  方法:设置头像样式
-(void)setHeadPortrait{
    //  把头像设置成圆形
    self.myHeadPortrait.layer.cornerRadius=self.myHeadPortrait.frame.size.width/2;//裁成圆角
    self.myHeadPortrait.layer.masksToBounds=YES;//隐藏裁剪掉的部分
    //  给头像加一个圆形边框
    self.myHeadPortrait.layer.borderWidth = 1.5f;//宽度
    self.myHeadPortrait.layer.borderColor = [UIColor whiteColor].CGColor;//颜色
}
@end

你可能感兴趣的:(iOS开发笔记:实现圆形头像)