iOS——Quartz2D(二维图形绘制)

###1.Quartz2D 基本概述

• Quartz 2D是一个二维图形绘制引擎，适用于iOS和Mac OS X环境，Quartz 2D API可以很多绘制功能，如基本路径的绘制、透明度、描影、绘制阴影、透明层、颜色管理、反锯齿、PDF文档生成和PDF元数据访问。
• Quartz 2D的API是 Core Graphics框架的一部分，因此其中的很多数据类型和方法是以CG开头的。

###2.Quartz2D在iOS开发中的价值

• 为了便于搭建美观的UI界面，iOS提供了UIKit框架，里面有各种各样的UI控件，比如:UILabel:显示文字;UIImageView：显示图片；UIButton：同时显示图片和文字（能点击）；利用UIKit框架提供的控件，拼拼凑凑，能搭建和现实一些简单、常见的UI界面。但是，有些UI界面极其复杂、而且比较个性化，用普通的UI控件无法实现，这时可以利用Quartz2D技术将控件内部的结构画出来，自定义控件的样子。其实，iOS中大部分控件的内容都是通过Quartz2D画出来的。因此，Quartz2D在iOS开发中很重要的一个价值是：自定义view（自定义UI控件）。

###3.UIBezierPath 和 Core Graphics

• OS系统本身提供了两套绘图的框架，即UIBezierPath 和 Core Graphics。而前者所属UIKit，其实是对Core Graphics框架关于path的进一步封装，所以使用起来比较简单。但是毕竟Core Graphics更接近底层，所以它更加强大。

###4.UIBezierPath

• UIKit中的UIBezierPath是Core Graphics框架关于path的一个封装(封装为OC的方法)。 使用UIBezierPath绘图不需要手动获取绘图上下文,当drawRect方法被调用时，UIView的绘图上下文属于当前图形上下文。
• 使用UIBezierPath可以创建基于矢量的路径，例如椭圆或者矩形，或者有多个直线和曲线段组成的形状。 ####开始绘图

1.首先创建一个UIView，并且实现它的drawRect:方法。视图的drawRect:方法在视图显示在屏幕上及它的内容需要更新时被调用。

2.重写drawRect:方法。或者创建一个新的方法使用drawRect:调用。

3.创建相应图形，并设置一些修饰属性。

####示例

1.设置路径属性

    // 设置填充颜色(内部填充)
    [[UIColor redColor] setFill]; 
    [path fill];

    // 设置描边颜色
   [[UIColor whiteColor] setStroke]; 
   [path stroke];

    // 线宽
    path.lineWidth = 5; 

    // 设置线头样式：三种样式，kCGLineCapButt, kCGLineCapRound, kCGLineCapSquare
    path.lineCapStyle = kCGLineCapRound;

    // 设置线连接点样式：kCGLineJoinMiter, kCGLineJoinRound,kCGLineJoinBevel
    path.lineJoinStyle = kCGLineJoinMiter;

    // 设置虚线： dashs: 虚线的虚实线的长度，count: 虚线的组成段数， phase: 设置虚线的起始位置
    CGFloat dashs[] = {2,10,2};
    [path setLineDash:dashs count:3 phase:0];

2.画线条

    // 1、创建一条路径对象
    UIBezierPath *path = [UIBezierPath bezierPath];
    
    // 2、将画笔移动到某个点
    [path moveToPoint:CGPointMake(20, 50)];
    
    // 3、绘制一条直线到某个点
    [path addLineToPoint:CGPointMake(300, 50)];
    [path addLineToPoint:CGPointMake(160, 200)];

    // 4、闭合路径 
    // 当你有两条线的时候可以使用闭合路径使这个闭合可以形成一个三角形
    [path closePath];

3.基本图形

CGRect rect = CGRectMake(20, 260, 320, 200);
    
    // 画矩形
     // UIBezierPath *path = [UIBezierPath bezierPathWithRect:rect];

    // 圆角矩形
     // UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:rect cornerRadius:20];
    
    // 内切的椭圆、圆形
     UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:rect];
    
    [[UIColor redColor] setStroke];
    [[UIColor whiteColor] setFill];
    path.lineWidth = 5;
    
    [path stroke];
    [path fill];

4.这里有一个Demo里面有更多的示例 UIBezierPath绘图

###5.Core Graphics

• 这是一个绘图专用的API族，它经常被称为QuartZ或QuartZ 2D。Core Graphics是iOS上所有绘图功能的基石，包括UIKit。

1.绘图路径相关函数

CGContextMoveToPoint(): 定位到某个点

CGContextAddLineToPoint(): 画线，添加一条直线到一个点

CGContextAddRect(): 画矩形

CGContextAddEllipseInRect(): 内切圆或者椭圆

CGContextAddQuadCurveToPoint(): 一个控制点的贝塞尔曲线

CGContextAddCurveToPoint(): 两个控制点的贝塞尔曲线

CGContextAddArc(): 画曲线

CGContextSetLineDash(): 画虚线

CGContextAddPath(): 画指定的路劲

CGContextClosePath(): 闭合当前路径

2.绘图设置相关函数

CGContextSetLineWidth(): 设置线条的宽度

CGContextSetStrokeColorWithColor(): 设置线条的颜色(使用UIColor颜色)

CGContextSetStrokeColor(): 设置线条颜色(三色值和透明度)

CGContextSetRGBStrokeColor(): 设置线条颜色(RGB值)

CGContextSetFillColor(): 设置图形填充颜色(三色值和透明度)

CGContextSetFillColorWithColor(): 设置填充颜色(UIColor值)

CGContextSetRGBFillColor():设置填充颜色(RGB值)

CGContextSetAlaha(): 设置透明度

CGContextSetShouldAntialias(): 是否开启抗锯齿

CGContextSetLineCap(): 设置直线端点的样式()

CGContextSetLineJoin(): 设置直线连接点的样式

CGContextSetShadow(): 设置阴影(尺寸和模糊度)

CGContextSetShadowWithClor(): 设置阴影和阴影颜色

3.图形填充相关函数

CGContextFillRect(): 填充一个矩形

CGContextStrokePath(): 描边

CGContextFillPath(): 只填充不描边

CGContextEOFillPath(): 使用奇偶规则填充

CGContextDrawPath(): 绘制路径(可以选择填充的样式)

4.设置要绘制的图形

   // 获取当前绘图上下文，相当于创建“画布”
   CGContextRef graph = UIGraphicsGetCurrentContext();
   //直线
   CGContextMoveToPoint(graph, 100, 250);
   CGContextAddLineToPoint(graph, 150, 150);

   // 矩形
   CGContextAddRect(graph, CGRectMake(10, 20, 100, 100));
   // 内切圆\椭圆
   CGContextAddEllipseInRect(graph, CGRectMake(120, 20, 100, 100));

   // 线宽
   CGContextSetLineWidth(graph, 5); 
   // 填充颜色
   CGContextSetFillColorWithColor(graph, [UIColor blueColor].CGColor); 
   // 线条颜色
   CGContextSetStrokeColorWithColor(graph, [UIColor whiteColor].CGColor); 
   // 抗锯齿
   CGContextSetShouldAntialias(graph, YES);
   // 填充
   CGContextFillPath(graph);    
   // 描边
   CGContextStrokePath(graph); 

###6.结束

Core Graphics是iOS绘图的基础框架,UIKit是对它的一个封装,以使绘制常见图形更加方便,比如UIBezierPath就可以直接绘制圆角矩形，而Core Graphics要通过不同的方法配合使用才能实现,iOS应用开发中的大部分绘制需求应该都可以通过UIKit的绘制方法实现。

转载于:https://my.oschina.net/tiankongmichael/blog/741008