CGContextRef處理圓形圖片

餘默發表於2018-07-06
GCContext
  • 做專案的時候經常遇到過自定義cell，就拿朋友圈來說，使用者的頭像也是要切圓形的，通常都是在cell裡將imageView的layer做處理，像這樣

UIImageView *imageView = [[UIImageView alloc] init];
imageView.layer.cornerRadius = 10;
imageView.layer.masksToBounds = YES;複製程式碼
  • 那麼問題來了，這個layer是系統封裝好的消耗的記憶體會相對比較大，只以一兩個imageView是很難測出來，在多個需要處理的imageView時候MJ也推薦用圖形上下文去處理，我自己去測試過，寫一個自定義TableViewCell，新增子類控制元件UIImageView，用兩種方法對比，layer和圖形上下文切的圓形圖，開始是載入20個tableVIewCell，記憶體消耗沒有多在區別，後來加到幾百個的時候記憶體消耗就有點明顯了。

//UIImage+YMExtension.h
 
#import <UIKit/UIKit.h>
 
@interface UIImage (YMExtension)
 
/**
 * 返回圓形圖片
 */
- (instancetype)ym_circleImage;
 
/**
 * 通過圖片名，返回圓形圖片
 */
+ (instancetype)ym_circleImageWith:(NSString *)name;
 
@end

複製程式碼

#import "UIImage+YMExtension.h"
 
@implementation UIImage (YMExtension)
 
- (instancetype)ym_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;
}
 
+ (instancetype)ym_circleImageWith:(NSString *)name
{
    return [[self imageNamed:name] ym_circleImage];
}
 
 
@end
複製程式碼

注：下面這個類主要是處理網路載入後的圖片，需要上面的類輔助，網路載入圖片用的是第三方SDWebImageManager

//UIImageView+YMExtension.h
 
#import <UIKit/UIKit.h>
 
@interface UIImageView (YMExtension)
 
/**
 * 返回圓形圖片
 */
- (void)ym_setCircleHeader:(NSString *)url placeholder:(NSString *)placeholder;
 
/**
 * 返回方形圖片
 */
- (void)ym_setRectHeader:(NSString *)url placeholder:(NSString *)placeholder;
 
@end
複製程式碼

//UIImageView+YMExtension.m
#import "UIImageView+YMExtension.h"
#import <UIImageView+WebCache.h>
 
@implementation UIImageView (YMExtension)
 
/**
 返回圓形圖片
 
 @param url 圖片url
 @param placeholder 佔點陣圖
 */
- (void)ym_setCircleHeader:(NSString *)url placeholder:(NSString *)placeholder
{
    //設定佔點陣圖片(如果不設定這個方法，那麼圖片如果載入失敗，圖片是方形而不是圓形)
    UIImage *placeHolder = [UIImage ym_circleImageWith:placeholder];
    [self sd_setImageWithURL:[NSURL URLWithString:url] placeholderImage:placeHolder completed:^(UIImage * _Nullable image, NSError *_Nullable error, SDImageCacheType cacheType, NSURL * _Nullable imageURL) {
        
        //如果圖片載入失敗則返回（如果空佔點陣圖片有效）
        if (image == nil) {
            return ;
        }
        //返回圓形圖片
        self.image = [image ym_circleImage];
    }];
}
 
 
/**
 返回方形圖片
 
 @param url 圖片url
 @param placeholder 佔點陣圖
 */
- (void)ym_setRectHeader:(NSString *)url placeholder:(NSString *)placeholder
{
    UIImage *placeHoder = [UIImage imageNamed:placeholder];
    [self sd_setImageWithURL:[NSURL URLWithString:url] placeholderImage:placeHoder];
}
 
 
@end
複製程式碼


相關文章