前篇地址:iOS繪圖基礎(chǔ)(圖形文字曲線相關(guān))
這篇主要是記錄記錄iOS繪圖與圖像有關(guān)的一些處理。包括繪制圖片,裁剪圖片,給圖片增加水印等常用功能。
繪制圖片
作為圖片來說,也有兩套方式去繪制圖片。UIKit的方式、CoreGraphics的API方式。
第一種:(非常快速)
- (void)drawRect:(CGRect)rect {
/* 繪制圖片 */
UIImage *image = [UIImage imageNamed:@"Vokie"];
[image drawInRect:CGRectMake(10, 10, 100, 100)];
}
第二種:(稍顯復(fù)雜)
- (void)drawRect:(CGRect)rect {
/* 繪制圖片 */
CGRect imageRect = CGRectMake(10, -10, 100, 100);
//獲取上線文context
CGContextRef context = UIGraphicsGetCurrentContext();
/*圖片繪制時(shí)的上下顛倒問題,具體原因不明,可能與底層的繪制API及其鏡像相關(guān),待深入研究。
所以做了下面的一次翻轉(zhuǎn),一次平移的操作來修正*/
//翻轉(zhuǎn)context
CGContextScaleCTM(context, 1, -1);
//平移context
CGContextTranslateCTM(context, 0, -imageRect.size.height);
UIImage *cgImage = [UIImage imageNamed:@"Vokie"];
//繪圖
CGContextDrawImage(context, imageRect, cgImage.CGImage);
}
對第二種方法,稍開腦洞。既然可以對context進(jìn)行操作平移,縮放操作,也就可以旋轉(zhuǎn)咯?
動手試試:
在上面代碼的基礎(chǔ)上增加CGContextRotateCTM(context, M_PI_2 / 3.0);
完全可以,效果如圖:

rotate.png
裁剪圓角圖片(原先圖片)
- (void)drawRect:(CGRect)rect {
/* 裁剪圖片 */
//imageSize的設(shè)置,決定圖片裁剪后的導(dǎo)出大小
CGSize imageSize = CGSizeMake(100, 100);
UIGraphicsBeginImageContextWithOptions(imageSize, NO, UIScreen.mainScreen.scale);
UIBezierPath *circlePath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 100, 100)];
[circlePath addClip];
UIImage *clipImage = [UIImage imageNamed:@"Vokie"];
[clipImage drawInRect:CGRectMake(0, 0, 100, 100)];
/* 繪制水印 */
NSString *waterMark = @"@vokie";
[waterMark drawAtPoint:CGPointMake(25, 20) withAttributes:@{
NSFontAttributeName:[UIFont systemFontOfSize:13],
NSForegroundColorAttributeName:[UIColor whiteColor]
}];
//此時(shí)導(dǎo)出的圖片的大小是受imageSize的影響。
UIImage *clipedImage = UIGraphicsGetImageFromCurrentImageContext();
//將裁剪后的圖片圓形圖片返回出去給外部調(diào)用
//return clipedImage;
UIGraphicsEndImageContext();
//將裁剪后的圖片放大并展示到context畫布上。
[clipedImage drawInRect:CGRectMake(30, 10, 140, 140)];
}
需要注意的是,必須要先調(diào)用addClip方法,然后在draw圖片。先后順序不能顛倒??梢允謩痈母倪@些代碼,實(shí)踐出真知。運(yùn)行效果如下:

wm.png
基于上面的圓形裁剪的代碼,也就可以一定程度上寫出類似于上傳圖片前的矩形裁剪的代碼?;驹硎且恢碌?。
綜合理解下:
熟練掌握了iOS繪制的相關(guān)內(nèi)容(圖形文字圖像等的繪制、context的平移縮放旋轉(zhuǎn),圖像尺寸縮放裁剪等),便可以解決實(shí)際開發(fā)中遇到的各種問題。因?yàn)樵陂_發(fā)中,經(jīng)常會和圖片打交道。當(dāng)然更重要的是了解其背后的底層知識。這兩篇也就是學(xué)習(xí)筆記加上入門會寫。還要繼續(xù)在這個(gè)文章分類下添加更多的深入篇。