iOS开发UI-利用Quartz2D 实现基本绘图（画三角形、矩形、圆、圆弧）

1.画三角形  运行结果如下

1.1具体实现步骤

1.1.1首先新建一个project，然后自定义一个view

1.2代码

[objc] view plain copy

1. #import "htingShapeView.h"  
2.   
3. @implementation htingShapeView  
4.   
5. - (id)initWithFrame:(CGRect)frame  
6. {  
7.     self = [super initWithFrame:frame];  
8.     if (self) {  
9.         // Initialization code  
10.     }  
11.     return self;  
12. }  
13.   
14. - (void)drawRect:(CGRect)rect  
15. {  
16. //    draw4Rect();  
17.     drawTriangle();  
18. }  
19.   
20. /** 
21.  *  画四边形 
22.  */  
23. void draw4Rect()  
24. {  
25.     // 1.获得上下文  
26.     CGContextRef ctx = UIGraphicsGetCurrentContext();  
27.       
28.     // 2.画矩形  
29.     CGContextAddRect(ctx, CGRectMake(10, 10, 150, 100));  
30.       
31.     // set : 同时设置为实心和空心颜色  
32.     // setStroke : 设置空心颜色  
33.     // setFill : 设置实心颜色  
34.     [[UIColor whiteColor] set];  
35.       
36.     //    CGContextSetRGBFillColor(ctx, 0, 0, 1, 1);  
37.       
38.     // 3.绘制图形  
39.     CGContextFillPath(ctx);  
40. }  
41.   
42. /** 
43.  *  画三角形 
44.  */  
45. void drawTriangle()  
46. {  
47.     // 1.获得上下文  
48.     CGContextRef ctx = UIGraphicsGetCurrentContext();  
49.       
50.     // 2.画三角形  
51.     CGContextMoveToPoint(ctx, 0, 0);  
52.     CGContextAddLineToPoint(ctx, 100, 100);  
53.     CGContextAddLineToPoint(ctx, 150, 80);  
54.     // 关闭路径(连接起点和最后一个点)起点和终点连起来  
55.     CGContextClosePath(ctx);  
56.       
57.     //  
58.     CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);  
59.       
60.     // 3.绘制图形  
61.     CGContextStrokePath(ctx);  
62. }  
63.   
64. @end  

2.画矩形运行效果如下

2.1具体实现步骤

2.1.1搭建界面同上

2.1.2代码

[objc] view plain copy

1. #import "htingShapeView.h"  
2.   
3. @implementation htingShapeView  
4.   
5. - (id)initWithFrame:(CGRect)frame  
6. {  
7.     self = [super initWithFrame:frame];  
8.     if (self) {  
9.         // Initialization code  
10.     }  
11.     return self;  
12. }  
13.   
14. - (void)drawRect:(CGRect)rect  
15. {  
16.     draw4Rect();  
17. //    drawTriangle();  
18. }  
19.   
20. /** 
21.  *  画四边形 
22.  */  
23. void draw4Rect()  
24. {  
25.     // 1.获得上下文  
26.     CGContextRef ctx = UIGraphicsGetCurrentContext();  
27.       
28.     // 2.画矩形  
29.     CGContextAddRect(ctx, CGRectMake(10, 10, 150, 100));  
30.       
31.     // set : 同时设置为实心和空心颜色  
32.     // setStroke : 设置空心颜色  
33.     // setFill : 设置实心颜色  
34.     [[UIColor whiteColor] set];  
35.       
36.     //    CGContextSetRGBFillColor(ctx, 0, 0, 1, 1);  
37.       
38.     // 3.绘制图形  
39.     CGContextFillPath(ctx);  
40. }  
41.   
42. /** 
43.  *  画三角形 
44.  */  
45. void drawTriangle()  
46. {  
47.     // 1.获得上下文  
48.     CGContextRef ctx = UIGraphicsGetCurrentContext();  
49.       
50.     // 2.画三角形  
51.     CGContextMoveToPoint(ctx, 0, 0);  
52.     CGContextAddLineToPoint(ctx, 100, 100);  
53.     CGContextAddLineToPoint(ctx, 150, 80);  
54.     // 关闭路径(连接起点和最后一个点)起点和终点连起来  
55.     CGContextClosePath(ctx);  
56.       
57.     //  
58.     CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);  
59.       
60.     // 3.绘制图形  
61.     CGContextStrokePath(ctx);  
62. }  
63.   
64. @end  

3.画圆  圆弧  等 运行效果如下

3.1代码实现

[objc] view plain copy

1. #import "htingCircleView.h"  
2.   
3. @implementation htingCircleView  
4.   
5.   
6. - (id)initWithFrame:(CGRect)frame  
7. {  
8.     self = [super initWithFrame:frame];  
9.     if (self) {  
10.         // Initialization code  
11.     }  
12.     return self;  
13. }  
14.   
15. /** 
16.  *  在view第一次显示到屏幕上的时候会调用一次 
17.  */  
18. - (void)drawRect:(CGRect)rect  
19. {  
20. //    drawCircle2();  
21.       drawCircle();  
22. }  
23.   
24. void drawCircle2()  
25. {  
26.     // 1.获得上下文  
27.     CGContextRef ctx = UIGraphicsGetCurrentContext();  
28.       
29.     // 2.画1/4圆  
30.     CGContextMoveToPoint(ctx, 100, 100);  
31.     CGContextAddLineToPoint(ctx, 100, 150);  
32.     CGContextAddArc(ctx, 100, 100, 50, -M_PI_2, M_PI, 1);  
33.     CGContextClosePath(ctx); //合并路径  把起点和终点连起来  
34.       
35.     [[UIColor redColor] set];//设置颜色  红色  
36.       
37.     // 3.显示所绘制的东西   FillPath实心  
38.     CGContextFillPath(ctx);  
39.   
40. }  
41.   
42.   
43. /** 
44.  *  画圆弧 
45.  */  
46. void drawArc()  
47. {  
48.     // 1.获得上下文  
49.     CGContextRef ctx = UIGraphicsGetCurrentContext();  
50.       
51.     // 2.画圆弧  
52.     // x\y : 圆心  
53.     // radius : 半径  
54.     // startAngle : 开始角度  
55.     // endAngle : 结束角度  
56.     // clockwise : 圆弧的伸展方向(0:顺时针, 1:逆时针)  
57.     //    CGContextAddArc(<#CGContextRef c#>, <#CGFloat x#>, <#CGFloat y#>, <#CGFloat radius#>, <#CGFloat startAngle#>, <#CGFloat endAngle#>, <#int clockwise#>)  
58.     CGContextAddArc(ctx, 100, 100, 50, M_PI_2, M_PI, 0);  
59.     //    CGContextAddArc(ctx, 100（圆心x）, 100（圆心y), 50, M_PI_2, M_PI, 0);  
60.       
61.       
62.     // 3.显示所绘制的东西  
63.     CGContextFillPath(ctx); //把绘制的路径用空心显示出来  
64.     //CGContextStrokePath(ctx);画实心  
65. }  
66.   
67. /** 
68.  *  画圆 
69.  */  
70. void drawCircle()  
71. {  
72.     // 1.获得上下文  
73.     CGContextRef ctx = UIGraphicsGetCurrentContext();  
74.       
75.     // 2.画圆  
76.     CGContextAddEllipseInRect(ctx, CGRectMake(50, 10, 100, 100));//(50, 10,是坐标也就是这个圆的位置   100, 100表示宽高都是100  
77.       
78.     CGContextSetLineWidth(ctx, 10); //设置线宽画圆环  
79.       
80.     // 3.显示所绘制的东西  
81.     CGContextStrokePath(ctx);  
82. }  
83.   
84. @end 
    

转载于:https://www.cnblogs.com/Free-Thinker/p/5948737.html