Quartz 2D簡單的繪圖

標籤：

1. 利用CG架構繪圖的步驟：
2.  1.子類化UIView
3.  2.在GraphicView中複寫drawRect方法
4.  3.擷取圖形內容物件
5.  4.繪製線條
6.  (1)先建立一個路徑，把線條定義在這個路徑上，再把路徑交給context去顯示。
7.  (2)直接把線條繪製到context上去。
8.  5.繪製簡單圖形
9.  6.繪製文本

10. 7.繪製映像

12.- (void)drawRect:(CGRect)rect {

13. //1.擷取圖形上下文

1. CGContextRef context = UIGraphicsGetCurrentContext();//圖形上下文
3. [self drawImage:context];

17.}

19.////繪製線條方法一

20.//2.建立一個繪製路徑

1. CGMutablePathRef path = CGPathCreateMutable();

22.//在路徑上添加一個起點

1. CGPathMoveToPoint(path, NULL, 50, 50);
2. CGPathAddLineToPoint(path, NULL, 100, 100);

25.//繪製完畢後關閉路徑，這樣會把起始點和終點串連

1. CGPathCloseSubpath(path);

27.//3.把路徑添加到圖形上下文

1. CGContextAddPath(context, path);

29.//4.設定圖形內容相關的屬性

1. //設定線寬
2. CGContextSetLineWidth(context, 5);
3. //設定線條顏色
4. CGContextSetRGBStrokeColor(context, 254.0/255, 201.0/255, 21.0/255, 1);
5. //填充顏色
6. CGContextSetRGBFillColor(context, 0, 1, 0, 1);

36.//5.在圖形上下文上繪製路徑

1. /*
2. 繪製模式：
3. kCGPathFill：填充（實心）
4. kCGPathStroke：畫線（空心）
5. kCGPathFillStroke ：即畫線又填充
6. */
7. CGContextDrawPath(context, kCGPathFillStroke);

44.//6.釋放路徑，有create就要有release

1. CGPathRelease(path);

47.////繪製線條方法二

48.CGPoint points[] = {{50,50},{100,100},{50,100},{50,50}};

1. CGContextAddLines(context, points, 4);

50.//設定線條顏色

1. [[UIColor redColor] setStroke];

52.//設定填充顏色

1. [[UIColor blueColor] setFill];

54.//同時設定線條和填充顏色

1. [[UIColor redColor] set];

56.CGContextDrawPath(context, kCGPathFillStroke);

58.//繪製矩形

59.//1.使用CG提供的函數

1. CGRect rect = CGRectMake(10, 10, 100, 200);
2. //添加到圖形上下文中
3. CGContextAddRect(context, rect);
4. //設定context的屬性
5. [[UIColor redColor] set];   
6. CGContextDrawPath(context, kCGPathFillStroke);

66.//2.使用UIKit架構提供的函數

1. CGRect rect = CGRectMake(10, 10, 100, 200);
2. //設定context的屬性
3. [[UIColor redColor] set];
5. //繪製實心矩形
6. //UIRectFill(rect);
7. //繪製空心矩形
8. UIRectFrame(rect);

76.//繪製一個圓形

77.//1.

1. x,y圓心的座標
2. radius:半徑
3. startAngel:起始角度
4. endAngel:結束的角度
5. clockwise:0順時針，1逆時針
6. CGContextAddArc(context, 160, 160, 100, 0, M_PI_4, 0);

84.//2.給定一個矩形，繪製一個內切圓

1. CGRect rect = CGRectMake(50, 50, 100, 100);
2. [[UIColor redColor] set];
3. UIRectFrame(rect);
4. CGContextAddEllipseInRect(context, rect);
5. CGContextDrawPath(context, kCGPathFillStroke);

91.//繪製貝賽爾曲線

92.//設定起點

1. CGContextMoveToPoint(context, 20, 200);
2. //CGContextAddCurveToPoint(context, 100, 20, 200, 300, 300, 50);
3. CGContextAddQuadCurveToPoint(context, 150, 20, 300, 200);
4. [[UIColor redColor] set];
5. CGContextDrawPath(context, kCGPathStroke);

98.//繪製一個文本

1. NSString *str = @"hello world";
2.     
3.     CGRect rect = CGRectMake(50, 50, 200, 300);
4.     
5.     [[UIColor whiteColor] setFill];
6.     
7.     UIRectFill(rect);
8.     
9.     UIFont *font = [UIFont systemFontOfSize:20];
10.     UIColor *color = [UIColor redColor];
11.     
12.     //建立段落樣式對象，通過對其屬性的設定可以設定文字在段落中顯示的樣式。
13.     NSMutableParagraphStyle *style = [[NSMutableParagraphStyle alloc] init];
14.     style.lineBreakMode = NSLineBreakByWordWrapping;
15.     style.alignment = NSTextAlignmentCenter;
16.     
17. //    [str drawInRect:rect withFont:font lineBreakMode:NSLineBreakByWordWrapping alignment:NSTextAlignmentCenter];
18.     
19.     [str drawInRect:rect withAttributes:
20.   @{
21.     NSFontAttributeName:font,
22.     NSForegroundColorAttributeName:color,
23.     NSParagraphStyleAttributeName:style
24.     }];
25. //這種繪製文本的方式非常輕量級，不需要建立一個UILabel控制項，並且可以根據需求定製效果。
26.  
27. //繪製圖片
28. //1.使用UIKit提供的方法繪製
29.     UIImage *image = [UIImage imageNamed:@"mp3.jpg"];
30.     圖片展開在指定矩形地區顯示
31.     [image drawInRect:CGRectMake(0, 0, 320, 200)];
32.     圖片平鋪在指定地區顯示
33.     [image drawAsPatternInRect:CGRectMake(0, 0, 320, 200)];
34. //2.用CoreGraphic提供的函數繪製
35.     //CG座標系統轉化為UIKit的座標系統
36.     CGContextSaveGState(context);
37.     //(1)順時針旋轉180度
38.     CGContextRotateCTM(context, M_PI);
39.     //（2）x縮放為原來的-1倍
40.     CGContextScaleCTM(context, -1, 1);
41.     //(3)向上平移
42.     CGContextTranslateCTM(context, 0, -image.size.height);
43.     CGContextDrawImage(context, CGRectMake(0, 0, image.size.width, image.size.height), image.CGImage);
44.     //(4)恢複context
45.     CGContextRestoreGState(context);

Quartz 2D簡單的繪圖