CoreGraphic&UIBezierPath绘图比较

CoreGraphic&UIBezierPath绘图比较

CoreGraphic框架提供了面向C语言风格的绘图API，而贝塞尔曲线实际是面向OC编程风格的绘图方式，但其实它是对CoreGraphic的封装，下面我向大家展示这两种绘图方式：

CoreGraphic绘图

/**
 使用CoreGraphic来绘制
 */
- (void)drawRect:(CGRect)rect
{
    CGContextRef context = UIGraphicsGetCurrentContext();

    // 1、起点
    CGContextMoveToPoint(context, 150.f, 350.f);

    // 2、终点并设置圆弧
    CGContextAddArc(context, 200.f, 350.f, 50.f, 0, M_PI, YES);

    // 3、设置渲染属性
    [[UIColor blackColor] setFill]; // 填充色
    [[UIColor redColor] setStroke]; // 线条颜色

    CGContextSetLineWidth(context, 5.f); // 线宽

    // 4、开始渲染
    CGContextStrokePath(context); // 渲染路径
    CGContextFillPath(context); // 填充
}

使用CoreGraphic绘图一个最重要的概念—图形上下文CGContext，图形上下文是一个比较抽象的概念，可以理解为绘图环境，它包括了绘图需要的信息以及最后的输出，在UIView的drawRect:方法里UIKit会默认创建一个上下文对象，可以通过UIGraphicsGetCurrentContext来获得，当然也可以自己新建一个，具体的可以参考官方介绍Quartz 2D Programming Guide。

UIBezierPath绘图

    UIBezierPath *path = [UIBezierPath new];

    // 1、起点
    [path moveToPoint:CGPointMake(150.f, 350.f)];

    // 2、终点并设置圆弧
    [path addArcWithCenter:CGPointMake(200.f, 350.f) radius:50.f startAngle:0 endAngle:M_PI clockwise:YES];

    // 3、设置渲染属性
    [[UIColor blackColor] setFill]; // 填充色
    [[UIColor redColor] setStroke]; // 线条颜色

    path.lineWidth = 5.f;

    // 4、开始渲染
    [path stroke]; // 渲染路径
    [path fill]; // 填充

可以看出，贝塞尔曲线实际上是对CoreGraphic的封装，上面只是列举了绘图中的一种，还有很多诸如绘制椭圆、矩形、三角形、环等方法，常见的绘图软件也是基于它们的。

绘图比较

下面是两种方式最终的绘制结果：

从上图可以看出，绘图环境相同（主要指的是绘图需要的环境参数，包括坐标点、颜色和线宽）但是最终呈现的结果却不相同，那是什么原因导致的呢？
原因在于iOS中的坐标体系是和Quartz坐标体系中Y轴相反的，所以iOS UIView在做Quartz绘图时，Y轴已经做了Scale为-1的转换，因此造成CGPathAddArc函数最后一个是否是顺时针的参数结果正好是相反的，也就是说如果设置最后的参数为YES，根据参数定义应该是顺时针的，但实际绘图结果会是逆时针的。