码迷,mamicode.com
首页 > 移动开发 > 详细

【iOS】Quartz2D基本图形

时间:2014-12-21 23:21:31      阅读:285      评论:0      收藏:0      [点我收藏+]

标签:

 

一、画线段

技术分享
 1 - (void)drawRect:(CGRect)rect
 2 {
 3     // Drawing code
 4     // 1.获得图形上下文
 5     CGContextRef ctx = UIGraphicsGetCurrentContext();
 6     
 7     // 2.拼接图形(路径)
 8     // 设置线段宽度
 9     CGContextSetLineWidth(ctx, 10);
10     
11     // 设置线段头尾部的样式
12     CGContextSetLineCap(ctx, kCGLineCapRound);
13     
14     // 设置线段转折点的样式
15     CGContextSetLineJoin(ctx, kCGLineJoinRound);
16     
17     
18     /**  第1根线段(红色) **/
19     // 设置颜色
20     CGContextSetRGBStrokeColor(ctx, 1, 0, 0, 1);
21     // 设置一个起点
22     CGContextMoveToPoint(ctx, 10, 10);
23     // 添加一条线段到(100, 100)
24     CGContextAddLineToPoint(ctx, 100, 100);
25     
26     // 3.渲染显示到view上面(渲染一次)
27     CGContextStrokePath(ctx);
28     
29     //------------------------
30     
31     /**  第2根线段(蓝色)  **/
32     // 设置颜色
33     CGContextSetRGBStrokeColor(ctx, 0, 0, 1, 1);
34     // 设置一个起点
35     CGContextMoveToPoint(ctx, 200, 190);
36     // 添加一条线段到(150, 40)
37     CGContextAddLineToPoint(ctx, 150, 40);
38     CGContextAddLineToPoint(ctx, 120, 60);
39     
40     
41     // 3.渲染显示到view上面
42     CGContextStrokePath(ctx);
43 }
View Code

运行效果:

                  技术分享

 

二、画四边形和三角形

      画四边形和三角形,就是利用线段将其连接起来。代码如下:

技术分享
/**
 *  画四边形
 */
void draw4Rect()
{
    // 1.获得上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    // 2.画矩形
    CGContextAddRect(ctx, CGRectMake(10, 10, 150, 100));
    
    // set : 同时设置为实心和空心颜色
    // setStroke : 设置空心颜色
    // setFill : 设置实心颜色
    [[UIColor whiteColor] set];
    
//    CGContextSetRGBFillColor(ctx, 0, 0, 1, 1);
    
    // 3.绘制图形
    CGContextFillPath(ctx);
}

/**
 *  画三角形
 */
void drawTriangle()
{
    // 1.获得上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    // 2.画三角形
    CGContextMoveToPoint(ctx, 0, 0);
    CGContextAddLineToPoint(ctx, 100, 100);
    CGContextAddLineToPoint(ctx, 150, 80);
    // 关闭路径(连接起点和最后一个点)
    CGContextClosePath(ctx);
    
    //
    CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);
    
    // 3.绘制图形
    CGContextStrokePath(ctx);
}
View Code

运行效果:

    技术分享          技术分享

 

三、画圆、圆弧、扇形

  圆:一个圆圈

      圆弧:弧形,非封闭图形。

  扇形:比如四分之一圆,利用直线与圆弧组成。

技术分享
 1 - (void)drawRect:(CGRect)rect
 2 {
 3     // 1.获得上下文
 4     CGContextRef ctx = UIGraphicsGetCurrentContext();
 5     
 6     // 2.画1/4圆
 7     CGContextMoveToPoint(ctx, 100, 100);
 8     CGContextAddLineToPoint(ctx, 100, 150);
 9     CGContextAddArc(ctx, 100, 100, 50, -M_PI_2, M_PI, 1);
10     CGContextClosePath(ctx);
11     
12     [[UIColor redColor] set];
13     
14     // 3.显示所绘制的东西
15     CGContextFillPath(ctx);
16 }
17 
18 /**
19  *  画圆弧
20  */
21 void drawArc()
22 {
23     // 1.获得上下文
24     CGContextRef ctx = UIGraphicsGetCurrentContext();
25     
26     // 2.画圆弧
27     // x\y : 圆心
28     // radius : 半径
29     // startAngle : 开始角度
30     // endAngle : 结束角度
31     // clockwise : 圆弧的伸展方向(0:顺时针, 1:逆时针)
32     CGContextAddArc(ctx, 100, 100, 50, M_PI_2, M_PI, 0);
33     
34     
35     // 3.显示所绘制的东西
36     CGContextFillPath(ctx);
37 }
38 
39 /**
40  *  画圆
41  */
42 void drawCircle()
43 {
44     // 1.获得上下文
45     CGContextRef ctx = UIGraphicsGetCurrentContext();
46     
47     // 2.画圆
48     CGContextAddEllipseInRect(ctx, CGRectMake(50, 10, 100, 100));
49     
50     CGContextSetLineWidth(ctx, 10);
51     
52     // 3.显示所绘制的东西
53     CGContextStrokePath(ctx);
54 }
View Code

    技术分享

 

四、文字、图片

    就是将文文字与图片划到view上。

技术分享
 1 void drawImage()
 2 {
 3     // 1.取得图片
 4     UIImage *image = [UIImage imageNamed:@"me"];
 5     
 6     // 2.画
 7 //    [image drawAtPoint:CGPointMake(50, 50)];
 8 //    [image drawInRect:CGRectMake(0, 0, 150, 150)];
 9     [image drawAsPatternInRect:CGRectMake(0, 0, 200, 200)];
10     
11     // 3.画文字
12     NSString *str = @"为xxx所画";
13     [str drawInRect:CGRectMake(0, 180, 100, 30) withAttributes:nil];
14 }
15 
16 /**
17  *  画文字
18  */
19 void drawText()
20 {
21     // 1.获得上下文
22     CGContextRef ctx = UIGraphicsGetCurrentContext();
23     // 2.画矩形
24     CGRect cubeRect = CGRectMake(50, 50, 100, 100);
25     CGContextAddRect(ctx, cubeRect);
26     // 3.显示所绘制的东西
27     CGContextFillPath(ctx);
28     
29     
30     
31     // 4.画文字
32     NSString *str = @"哈哈哈哈Good morning hello hi hi hi hi";
33     //    [str drawAtPoint:CGPointZero withAttributes:nil];
34     
35     NSMutableDictionary *attrs = [NSMutableDictionary dictionary];
36     // NSForegroundColorAttributeName : 文字颜色
37     // NSFontAttributeName : 字体
38     attrs[NSForegroundColorAttributeName] = [UIColor redColor];
39     attrs[NSFontAttributeName] = [UIFont systemFontOfSize:50];
40     [str drawInRect:cubeRect withAttributes:attrs];
41 }
View Code

运行效果:

    技术分享     技术分享

【iOS】Quartz2D基本图形

标签:

原文地址:http://www.cnblogs.com/surge/p/4177140.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!