iOS給UIImageView新增圓角的三種方法

weixin_34365417發表於2017-07-03
iOSUIView

前言

在iOS開發中我們經常會遇到給UIImageView新增圓角，如：給使用者頭像設定圓角等。在這裡記錄一下使用過的三種方法。

方法一：通過設定UIView的layer來設定圓角

    UIImageView *imgView = [UIImageView new];
    imgView.image = [UIImage imageNamed:@"aa"];
    imgView.layer.cornerRadius  = imgView.frame.size.width / 2;
    imgView.layer.masksToBounds = YES;

此方法的有個缺點是：會強制Core Animation提前渲染螢幕的離屏繪製, 而離屏繪製就會給效能帶來負面影響，會有卡頓的現象出現

方法二：通過Graphics繪製圖片，將圖片裁剪成圓角

- (UIImage *)clipImage1:(UIImage *)image {
    UIGraphicsBeginImageContextWithOptions(image.size, NO, 0.0);
    
    // 獲取上下文
    CGContextRef contextRef = UIGraphicsGetCurrentContext();
    
    // 新增一個圓
    CGRect rect = CGRectMake(0, 0, image.size.width, image.size.height);
    CGContextAddEllipseInRect(contextRef, rect);
    CGContextClip(contextRef);
    
    // 畫圖片
    [image drawInRect:rect];
    
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    
    UIGraphicsEndImageContext();
    
    return newImage;
}

裁剪後設定圖片即可

方法三： 依然是繪製圖片，這次是通過貝塞爾曲線繪製圖片

- (UIImage *)clipImage2:(UIImage *)image {
    UIGraphicsBeginImageContextWithOptions(image.size, NO, 1.0);
    
    CGRect rect = CGRectMake(0, 0, image.size.width, image.size.height);
    [[UIBezierPath bezierPathWithRoundedRect:rect cornerRadius:image.size.width / 2] addClip];
    
    [image drawInRect:rect];
    
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    
    return newImage;
}

繪製後設定UIImageView的圖片即可

總結：

以上設定圖片圓角的三種方法，在使用過程中各有優缺點，需要根據實際情況具體判斷使用方法。

另外推薦一下我的導航欄聯動庫：GKNavigationController

相關文章