ios學習_Quartz2D學習筆記

標籤：

 

Quartz2D作用 ： 繪製圖案、繪製文字、繪製圖片、自訂控制項，其實大部分UI控制項的內容是通過Qurtz2D畫出來的

Quartz2D是來自Core Graphics是一個二維繪圖引擎，同時支援ios和Mac系統

 

利用Quartz2D繪製東西到View上的步驟 ： 

1.  自訂一類，繼承自UIView

2.  實現drawRect方法

　　2.1 取得當前View的相關聯的映像上下文: CGContextRef ctx = UIGraphicsGetCurrentContext();

　　2.2 繪製相應的圖形內容

　　2.3 利用圖形上下文將繪製的所有內容渲染到View上面:CGContextFillPath(ctx)或CGContextStrokePath(ctx);

 

常見Quartz2D方法 ：

　　CGContextRef ctx = UIGraphicsGetCurrentContext();//獲得上下文，返回的是同一個

　　CGContextMoveToPoint(ctx, 0, 0);//設定起點也可以是重新設定起點

　　CGContextAddLineToPoint(ctx, 100, 100);//添加一天線段

　　CGContextAddLineToPoint(ctx, 200, 300);//不要再設定起點

　　CGContextClosePath(ctx);//關閉路徑，也就是串連起點和終點

　　CGContextAddRect(ctx, CGRectMake(0, 0, 100, 100));//畫矩形

　　CGContextAddRect(ctx, CGRectMake(0, 0, 100, 100));//畫矩形

　　CGContextAddEllipseInRect(ctx, CGRectMake(0, 0, 100, 50));//畫橢圓

 　　CGContextAddArc(ctx, 50, 50, 40, 0, M_PI, 1);//radius :半徑    startAngle 開始角度    clockwise  ：0是順時針 1是逆時針

 

　　CGContextSetLineWidth(ctx, 5);//設定線寬

　　CGContextSetRGBFillColor(ctx, 0, 0, 0, 1);//設定RGB實心顏色

　　CGContextSetRGBStrokeColor(ctx, 0, 0, 0, 1);//設定RGB空心顏色

　　CGContextSetLineCap(ctx, kCGLineCapRound);//設定頭是圓的

　　CGContextSetLineJoin(ctx, kCGLineJoinRound);//設定轉折點

　　[[UIColor whiteColor] set];//可以設定顏色，實心和空心都可以

 

    [str drawAtPoint:CGPointZero withAttributes:nil];//畫文字

    [image drawInRect:CGRectMake(0, 0, 150, 150)];//畫圖片

    [image drawAsPatternInRect:CGRectMake(0, 0, 150, 150)];//平鋪效果

 　　

　　CGContextFillPath(ctx);//渲染，實心

　　CGContextStrokePath(ctx);//渲染，空心

 

圖形上下文棧 （使用這個可以）：

    CGContextSaveGState(ctx);//將ctx拷貝一次放到棧中

　 CGContextRestoreGState(ctx);//將棧頂得上下文出棧，替換當前的上下文

 

quartz2D應用情境 ：

 1. 打浮水印（兩張合成一張） 例子：

     UIImage *backgroundImage = [UIImage imageNamed:@" backgroundImage "];//載入圖片，為了設定之後內容相關的寬度

    UIGraphicsBeginImageContextWithOptions(backgroundImage.size, NO, 0.0);//根據背景圖片建立一個基於位元影像的上下文

    [oldImage drawInRect:CGRectMake(0, 0, backgroundImage.size.width, backgroundImage.size.height)];//把圖片畫上去

　　UIImage *logo = [UIImage imageNamed:@"logo"];//添加浮水印圖片

　　CGRect logoRect;//設定logo的位置

    [logo drawInRect:logoRect];//把浮水印畫到上下文上去

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();//產生合成的圖片

    UIGraphicsEndImageContext();//結束上下文

2．圖片裁剪

    UIImage *image = [UIImage imageNamed:@" image "];

    CGFloat borderW = 2;//設定外面環的大小

    CGFloat contextW = image.size.width + borderW * 2;

    CGFloat contextH = image.size.height + borderW * 2;

    UIGraphicsBeginImageContextWithOptions(CGSizeMake(contextW,    contextH), NO, 0.0);//

    CGContextRef ctx = UIGraphicsGetCurrentContext();//取得當前的上下文，

    CGFloat centerX = imageW * 0.5;

    CGFloat centerY = imageH * 0.5;

    CGContextAddArc(ctx, centerX, centerY, centerX, 0, M_PI * 2, 0);//畫圓

    [[UIColor whiteColor] set];

    CGContextFillPath(ctx);

    CGFloat radius = oldImage.size.width * 0.5;

    CGContextAddArc(ctx, centerX, centerY, radius, 0, M_PI * 2, 0);

    CGContextClip(ctx);//裁剪，裁剪只是對後面有影響

    [image drawInRect:CGRectMake(borderW, borderW, image.size.width, image.size.height)];

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

3.截屏

  UIGraphicsBeginImageContextWithOptions(self.view.frame.size, NO, 0.0);//根據View的大小開啟上下文

  [self.view.layer renderInContext:UIGraphicsGetCurrentContext()];//把View的圖層畫到上下文中

  UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();//根據上下文產生圖片

  UIGraphicsEndImageContext();//結束上下文

總結一下 ： 

（1）都要建立一個圖形上下文，並都是基於位元影像 UIGraphicsBeginImageContextWithOptions

（2） 取得當前的上下文在上面實現繪製  CGContextRef ctx = UIGraphicsGetCurrentContext();

（2）使用完圖形上下文之後都要關閉    UIGraphicsEndImageContext();

*儲存圖片到沙箱的代碼 ：        

        NSString * path = [[NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, 　　　YES)lastObject]stringByAppendingString:@"name.png"];

        NSData *data = UIImagePNGRepresentation(newImage);

        [data writeToFile:path atomically:YES];

 

相關知識點和注意點 ：

（1）   畫文字和圖片的時候不要上下文（利用oc來畫是不需要內容相關的）

（2）  如果想畫多種顏色，就要畫完一次就要渲染一次，也可以使用圖形上下文棧

（3）   drawRect方法不能手動調用，但是可以手動調用setNeedsDisplay，會把上一次的清掉

（4）   awakeFormNib當一個控制項從xib中建立的時候就會調用

（5）   自訂一個控制項的時候，如果控制項裡面有一個屬性的時候，一定要重寫setter方法

（6）   圖層是不能用drawRect方法的，但是可以用renderInContext

（7）   當點擊按鈕截屏的時候，應該讓截屏操作延時（延時函數在GCD筆記中有介紹），因為一點擊的時候按鈕會變灰。

（8）   如果要繪圖到View上，就只能在drawRect中繪製，因為在drawRect方法中才能取到View的圖形上下文

（9）   View之所以能顯示東西，是因為為它內部的layer

 

ios學習_Quartz2D學習筆記