Quartz2D的基本用法详解编程语言

Quartz 2D是一个二维绘图引擎，同时支持iOS和Mac系统。Quartz2D的基本用法。

1、自定义view的步骤

• 新建一个类，继承自UIView

• 实现- (void)drawRect:(CGRect)rect方法，然后在这个方法中

• 取得跟当前view相关联的图形上下文

• 绘制相应的图形内容

• 利用图形上下文将绘制的所有内容渲染显示到view上面

2、Quartz2D绘图的代码步骤

• 获得图形上下文
  CGContextRef ctx = UIGraphicsGetCurrentContext();

• 拼接路径（下面代码是搞一条线段）
  CGContextMoveToPoint(ctx, 10, 10);
  CGContextAddLineToPoint(ctx, 100, 100);

• 绘制路径
  CGContextStrokePath(ctx); // CGContextFillPath(ctx);

3、常用拼接路径函数

• 新建一个起点
  void CGContextMoveToPoint(CGContextRef c, CGFloat x, CGFloat y);

• 添加新的线段到某个点
  void CGContextAddLineToPoint(CGContextRef c, CGFloat x, CGFloat y);

• 添加一个矩形
  void CGContextAddRect(CGContextRef c, CGRect rect);

• 添加一个椭圆
  void CGContextAddEllipseInRect(CGContextRef context, CGRect rect);

• 添加一个圆弧
  void CGContextAddArc(CGContextRef c, CGFloat x, CGFloat y, CGFloat radius, CGFloat startAngle,                                         CGFloat endAngle, int clockwise);

4、常用绘制路径函数

• Mode参数决定绘制的模式
  void CGContextDrawPath(CGContextRef c, CGPathDrawingMode mode)

• 绘制空心路径
  void CGContextStrokePath(CGContextRef c)

• 绘制实心路径
  void CGContextFillPath(CGContextRef c)
  

  提示：一般以CGContextDraw、CGContextStroke、CGContextFill开头的函数，都是用来绘制路径的

5、图形上下文栈的操作

• 将当前的上下文copy一份,保存到栈顶(那个栈叫做”图形上下文栈”)
  void CGContextSaveGState(CGContextRef c)

• 将栈顶的上下文出栈,替换掉当前的上下文
  void CGContextRestoreGState(CGContextRef c)

6、代码实例

- (void)drawRect:(CGRect)rect 
{ 
    // Drawing code 
    // 1.获得图形上下文 
    CGContextRef ctxR = UIGraphicsGetCurrentContext(); 
      
    // 2.拼接图形(路径) 
    // 设置线段宽度 
    CGContextSetLineWidth(ctxR, 10); 
      
    // 设置线段头尾部的样式 
    /** 
        kCGLineCapButt, 
        kCGLineCapRound,    //圆角 
        kCGLineCapSquare 
    */ 
    CGContextSetLineCap(ctxR, kCGLineCapRound); 
      
    // 设置线段转折点的样式 
    /** 
        kCGLineJoinMiter, 
        kCGLineJoinRound,    //圆角 
        kCGLineJoinBevel 
    */ 
    CGContextSetLineJoin(ctxR, kCGLineJoinRound); 
      
    /**  第1根线段  **/ 
    // 设置颜色 
    CGContextSetRGBStrokeColor(ctxR, 1, 0, 0, 1); 
    // 设置一个起点 
    CGContextMoveToPoint(ctxR, 10, 10); 
    // 添加一条线段到(100, 100) 
    CGContextAddLineToPoint(ctxR, 100, 100); 
      
    // 渲染一次 
    CGContextStrokePath(ctxR); 
      
      
    /**  第2根线段  **/ 
    // 设置颜色 
    CGContextSetRGBStrokeColor(ctxR, 0, 0, 1, 1); 
    // 设置一个起点 
    CGContextMoveToPoint(ctxR, 200, 190); 
    // 添加一条线段到(150, 40) 
    CGContextAddLineToPoint(ctxR, 150, 40); 
    CGContextAddLineToPoint(ctxR, 120, 60); 
      
      
    // 3.渲染显示到view上面 
    CGContextStrokePath(ctxR); 
}

- (void)drawRect:(CGRect)rect 
{ 
    drawForRect(); 
} 
  
/** 
 *  画四边形 
 */ 
void drawForRect() 
{ 
    // 1.获得上下文 
    CGContextRef ctxR = UIGraphicsGetCurrentContext(); 
      
    // 2.画矩形 
    CGContextAddRect(ctxR, CGRectMake(10, 10, 150, 100)); 
      
    // set : 同时设置为实心和空心颜色 
    // setStroke : 设置空心颜色 
    // setFill : 设置实心颜色 
    [[UIColor whiteColor] set]; 
      
//    CGContextSetRGBFillColor(ctxR, 0, 0, 1, 1); 
      
    // 3.绘制图形 
    CGContextFillPath(ctxR); 
} 
  
/** 
 *  画三角形 
 */ 
void drawTriangle() 
{ 
    // 1.获得上下文 
    CGContextRef ctxR = UIGraphicsGetCurrentContext(); 
      
    // 2.画三角形 
    CGContextMoveToPoint(ctxR, 0, 0); 
    CGContextAddLineToPoint(ctxR, 100, 100); 
    CGContextAddLineToPoint(ctxR, 150, 80); 
    // 关闭路径(连接起点和最后一个点) 
    CGContextClosePath(ctxR); 
      
    // 
    CGContextSetRGBStrokeColor(ctxR, 0, 1, 0, 1); 
      
    // 3.绘制图形 
    CGContextStrokePath(ctxR); 
}

- (void)drawRect:(CGRect)rect 
{ 
    // 1.获得上下文 
    CGContextRef ctxR = UIGraphicsGetCurrentContext(); 
      
    // 2.画1/4圆 
    CGContextMoveToPoint(ctxR, 100, 100); 
    CGContextAddLineToPoint(ctxR, 100, 150); 
    CGContextAddArc(ctxR, 100, 100, 50, -M_PI_2, M_PI, 1); 
    CGContextClosePath(ctxR); 
      
    [[UIColor redColor] set]; 
      
    // 3.显示所绘制的东西 
    CGContextFillPath(ctxR); 
} 
  
/** 
 *  画圆弧 
 */ 
void drawArc() 
{ 
    // 1.获得上下文 
    CGContextRef ctxR = UIGraphicsGetCurrentContext(); 
      
    // 2.画圆弧 
    // x/y : 圆心 
    // radius : 半径 
    // startAngle : 开始角度 
    // endAngle : 结束角度 
    // clockwise : 圆弧的伸展方向(0:顺时针, 1:逆时针) 
    CGContextAddArc(ctxR, 100, 100, 50, M_PI_2, M_PI, 0); 
      
      
    // 3.显示所绘制的东西 
    CGContextFillPath(ctxR); 
} 
  
/** 
 *  画圆 
 */ 
void drawCircle() 
{ 
    // 1.获得上下文 
    CGContextRef ctxR = UIGraphicsGetCurrentContext(); 
      
    // 2.画圆 
    CGContextAddEllipseInRect(ctxR, CGRectMake(50, 10, 100, 100)); 
      
    CGContextSetLineWidth(ctxR, 10); 
      
    // 3.显示所绘制的东西 
    CGContextStrokePath(ctxR); 
}

- (void)drawRect:(CGRect)rect 
{ 
    drawImage(); 
} 
  
void drawImage() 
{ 
    // 1.取得图片 
    UIImage *image = [UIImage imageNamed:@"me"]; 
      
    // 2.画 
//    [image drawAtPoint:CGPointMake(50, 50)]; 
//    [image drawInRect:CGRectMake(0, 0, 150, 150)]; 
    [image drawAsPatternInRect:CGRectMake(0, 0, 200, 200)]; 
      
    // 3.画文字 
    NSString *str = @"为xxx所画"; 
    [str drawInRect:CGRectMake(0, 180, 100, 30) withAttributes:nil]; 
} 
  
/** 
 *  画文字 
 */ 
void drawText() 
{ 
    // 1.获得上下文 
    CGContextRef ctxR = UIGraphicsGetCurrentContext(); 
    // 2.画矩形 
    CGRect cubeRect = CGRectMake(50, 50, 100, 100); 
    CGContextAddRect(ctxR, cubeRect); 
    // 3.显示所绘制的东西 
    CGContextFillPath(ctxR); 
      
      
      
    // 4.画文字 
    NSString *str = @"哈哈哈哈Good morning hello hi hi hi hi"; 
    //    [str drawAtPoint:CGPointZero withAttributes:nil]; 
      
    NSMutableDictionary *attrs = [NSMutableDictionary dictionary]; 
    // NSForegroundColorAttributeName : 文字颜色 
    // NSFontAttributeName : 字体 
    attrs[NSForegroundColorAttributeName] = [UIColor redColor]; 
    attrs[NSFontAttributeName] = [UIFont systemFontOfSize:50]; 
    [str drawInRect:cubeRect withAttributes:attrs]; 
}