Quartz2D(2)

quartz2D:

1.模态modal===========================

//在跳轉之前的頁面設定模态頁面
CHTwoController *two = [[CHTwoController alloc] init];
//給即将要彈出的模态控制器包裝一個導航控制器
UINavigationController *nav = [[UINavigationController alloc] initWithRootViewContrller:two];
//彈出模态視圖
[self presentViewController:nav animated:YES completion:^{}
//關閉模态視圖：由于一個控制器是以模态形式展現出來，在關閉時，可以調用該控制器或者該控制器的自控制器讓控制器消失
//self dismissViewControllerAnimated:YES completion:^{}
self.navigationController dismissViewControllerAnimated:YES completion:^{}
           

2.繪制基本圖形:===========================

//擷取圖形上下文（儲存圖形，并且決定輸出目标）

CGContextRef ctx = UIGraphicsGetCurrentContext();

2.1線條：

//起點：
CGContextMoveToPoint(ctx,10,100);
//終點：
CGContextAddLineToPoint(ctx,100,100);
//狀态：
CGContextSetRGBStrokeColor(ctx,1.0,0,0,1.0);//紅色，1.0,0,0 是比例值：255/255.0  最後的1.0表示alpha
CGContextSetLineCap(ctx,kCGLineCapRound);//線段兩端的樣式
CGContextSetLineJoin(ctx,kCGLineJoinRound);//線段轉角的樣式
CGContextStrokePath(ctx);//空心的線段   ,CGContextFillPath(ctx) 實心的樣式
           

2.2三角形：

//由于是封閉的形狀，可以使用關閉起點和終點的方法完成最後的封閉

CGContextClosePath(ctx);

2.3四邊形：

//隻需要提供起點和寬高就可以
CGContextAddRect(ctx,CGRectMake(10,10,150,100));
//使用c語言方法顔色繪制
CGContextSetRGBStrokeColor();
CGContextSetRGBFillColor();
//可以使用OC的方法進行顔色繪制
[[UIColor purpleColor] setFill];
[[UIColor blueColor] setStroke];// 這兩種方法，隻能一次設定空心／實心一種方式
[[UIColor black] set];//這種方式可以同時設定空心和實心
           

2.4畫圓：

//第一種方式，使用限定矩形框範圍

CGContextAddEllipseInRect(ctx,CGRectMake(50,100,50,50));

//使用旋轉,圓心在100，100  半徑50  從0角度開始，到360結束，1為逆時針方向畫

CGContextAddArc(ctx,100,100,50,0,2*M_PI,1);

2.5畫弧：

//思路就是線畫一個圓弧線，在自動關閉，填充

CGContextAddArc(ctx,100,100,50,M_PI_2,M_PI,0);

CGContextClosePath(ctx);

2.6畫餅：

//思路就是畫一條線，接着畫一個弧，最後自動關閉

CGContextMoveToPoint(ctx,100,100);
CGContextAddLineToPoint(ctx,100,150);
CGContextAddArc(ctx,100,100,50,M_PI_2,M_PI,0);
CGContextClosePath(cxt);
           

2.7畫文字：

//第一種，隻在一行顯示，不換行

//Attribute是一個字典類型，存儲的是各種顔色，大小等設定
NSMutableDictionary *md = [NSMutableDictionary dictionary];
md[NSForegroundColorAttributeName] = [UIColor redColor];
md[NSFontAttributeName] = [UIFont systemFontOfSize:20];
[str drawAtPoint:CGPointMake(10,10) withAttributes:md];
           

//第二種，将文字繪制到一個指定的範圍内，可以換行，但超出後不顯示

[str drawInRect:CGRectMake(50,50,100,100) withAttributes:nil];

//2.8畫圖：

//第一種方式：從指定位置開始畫圖
[image drawAtPoint:CGPointMake(0,0)];
//第二種方式：繪制圖檔到layer，圖檔有所拉伸
[image drawInRect:CGRectMake(0,0,200,200)];
//第三種方式：繪制到layer，圖檔平鋪
[[image drawPatternInRect:CGRectMake(0,0,320,480)];
//設定圖檔的陰影,最後一個參數blur表示模糊度，越大越模糊
CGContextSetShadow(ctx,CGSizeMake(10,10),10);
           

3.圖形上下文棧 ：===========================

//由于要在同一個畫布上可能會繪制很多不同的形狀，這個時候需要使用圖形上下文棧來複制并儲存出來純淨的上下文來繪制其他的形狀

CGContextRef ctx = UIGraphicsGetCurrentContext();
//儲存第一份圖形上下文
CGContextSaveGState(ctx);
//儲存第二份圖形上下文
CGContextSaveGState(ctx);
//在原來圖形上下文中繪制
。。。。。
//還原第一份
CGContextRestoreGState(ctx);
//繪制第一份
CGContextMoveToPoint(ctx,80,30);
CGContextAddLineToPoint(ctx,80,150);
//還原第二份
CGContextRestoreGState(ctx);
//繪制第二份
CGContextMoveToPoint(ctx, 200, 30);
CGContextAddLineToPoint(ctx, 80, 150);
//渲染
CGContextStrokePath(ctx);
           

4.矩陣操作：===========================

CGContextRef ctx = UIGraphicsGetCurrentContext();

//設定矩陣操作 必須 在添加矩陣之前調用

//這個操作就是讓矩陣進行形變

CGContextRotateCTM(ctx,M_PI_4);//轉角度
CGContextScaleCTM(ctx,1.8,1.8);//放大縮小
CGContextTranslateCTM(ctx,0,250);//移動位置
CGContextAddRect(ctx,CGRectMake(200,100,100,100));
CGContextStrokePath(ctx);
           

5.刷幀：===========================

//通過Slider的移動，來改變圓的大小說明刷幀

6.刷幀動畫：===========================

//第一種方法：NSTime

//這個方法可以寫在initWithCoder中，initWithCoder是在目前View由StoryBoard或Xib建立時會自動調用

[NSTime scheduledTimerWithTimeInterval: 0.1 target:self selector:@selector(updataImage) userInfo:nil repeats:YES];

//第二種方法：CADisplayLink,預設60幀/秒

//這個方法也可以寫在awakeFromNib（隻調用一次）中，可以通過以下方式循環使用
CADisplayLink *display = [CADisplayLink displayLinkWithTarget:self selector:@selector(updateImage)];
[display addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
//方法updateImage，這個方法中執行重新繪圖操作
[ self setNeedsDisplay];
           

7.路徑：===========================

//在CGContextMoveToPoint(ctx,10,10)方法中，預設建立了路徑
//這裡手動建立路徑看看
CGMutablePathRef pathCtx = CGPathCreateMutable();
CGPathMoveToPoint(pathCtx,NULL,10,10);
CGPathAddLineToPoint(pathCtx,NULL,100,100);
CGContextAddPath(ctx,pathCtx);
//最後渲染
CGContextStrokePath(ctx);
//這裡注意：
//凡是通過quartz2D中帶有create/copy/retain方法建立出來的值，都要手動釋放，一定記住了
CGPathRelease(path);//或者CFRelease(path);
           

8.繪制bitmap：===========================

//加載圖檔
//建立一個bitmap上下文,參數1:将來建立出bitmap大小，參數2:透明，參數3:縮放比例
UIGraphicsBeginImageContextWithOptions(CGSizeMake(200,200),NO,0);
//擷取剛建立的bitmap上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//在這個上下文中繪圖
CGContextAddEllipseInRect(ctx,CGRectMake(0,0,300,300));
//渲染
CGContextStrokePath(ctx);
//最後可以擷取到生成的圖檔
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
//還可以儲存生成的圖檔到檔案中,先轉化成二進制資料，再寫入檔案
NSData *data = UIImagePNGRepresentation(image);//UIImageJPEGRepresentation(image,1);
[data writeToFile:@"/Users/apple/Desktop/abc.png" atomically:YES];
           

9.圖檔剪切：===========================

這裡完成一個大圓内部繪制一個小圓，讓圖檔顯示在小圓内

關鍵步驟：

//加載圖檔
UIImage *image = [UIImage imageName:icon];
//建立圖檔上下文
CGFloat margin = 10
CGSize size = CGSizeMake(image.size.width +margin,image.size.height+margin);
UIGraphicsBeginImageContextWithOptions(size,NO,0);
//繪制大圓，擷取剛建立bitmap上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextAddEllipseInRect(ctx,CGRectMake(0,0,size.width,size.height));
[[UIColor greenColor] set];
CGContextFillPath(ctx);
//繪制小圓,由于使用的方塊畫圓，是以方塊的起點小一點就可以了
CGContextAddEllipseInRect(ctx,margin*0.5,margin*0.5,image.size.width,image.size.height);
//指定範圍,
CGContextClip(ctx);
//繪制圖檔,把圖檔的寬高設定為小圓的寬高
[image drawInRect:CGRectMake()];
//取出圖檔顯示
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();