猫猫分享，必须精品
原创文章，欢迎转载。转载请注明：翟乃玉的博客
地址：http://www.jianshu.com/notebooks/4236923/latest
一：Quartz 2D简介
Quartz 2D是二维绘图引擎，他同时支持iOS和mac系统。Quartz2D的API是纯C语言的，来自于Core Graphics框架,所以里面的内容都是以CG开头的，比如CGContextRef。
1：iOS中的用处
- 绘制图形 : 包括绘制线条、三角形、矩形、圆、弧等。
- 绘制文字:平时我们用UILabel显示文字，这里完全可以用Quartz 2D自己显示文字。
- 绘制图片、生成图片。
- 读取PDF、者生成PDF。
- 屏幕截图、对图片进行裁剪。
- 自定义UI控件：系统的某些空间不能满足我们的要求时候，比如进度条之类的，我们可以用Quartz 2D绘制自己想要的控件。
** 在开发当中，Quartz 2D最具有的价值就是自定义UI控件了，当我们的控件样式极其复杂时,就可以用Quartz 2D把控件内部的结构给画出来。
2：学习Quartz 2D
学习Quartz 2D首先要知道CGContextRef（图形上下文）这个东西，图形上下文是用来保存用户绘制的内容状态,并决定绘制到哪个地方的。
绘图过程：用户首先把绘制好的内容先保存到图形上下文，然后
根据选择的图形上下文的不同,绘制的内容显示到不同的位置。
3：画直线
我们直接自定义view在view里面画，在iOS中新建一个UIView的子类，系统会自动给我们生成一个被注释掉的代码，这个方法是drawRect，我们可以在这个方法里面绘图了。当view加载到viewController上面的时候，此view的drawRect方法在view显示的时候调用，在viewWillAppear之后，viewDidAppear之前调用。
效果：
代码：
- (void)drawRect:(CGRect)rect {
// 1.获取到与view绑定的上下文。
CGContextRef ctx = UIGraphicsGetCurrentContext();//c语言方法获取
// 2.描述内容。
// 2.1 我们要画一条线。需要用到路径
UIBezierPath *path = [UIBezierPath bezierPath];
// 2.2 设置线的起点。
[path moveToPoint:CGPointMake(20, 10)];
// 2.3 设置线的终点
[path addLineToPoint:CGPointMake(200 ,150)];
//画第二条线，可以在原来基础上添加，也可以重新设置起点终点来画。
[path addLineToPoint:CGPointMake(250 ,10)];
// 3.把内容添加到上下文。
CGContextAddPath(ctx, path.CGPath);
// 4.显示出来。
CGContextStrokePath(ctx);
}
- 我相信自己看代码能懂，需要注意的其实就是下面这几个方法。
- CGContextRef ctx = UIGraphicsGetCurrentContext();
获取到当前view的上下文UIGraphicsGetCurrentContext()c语言方法，不要跟oc混淆。 -
UIBezierPathOC的类，专门用来弄路径的类
3.CGContextAddPath 把内容添加到上下文的方法，参数分别是上下文和路径，注意，这里的路径是c语音的路径，需要转换一下，UIBezierPath内有CGPathRef类型的字段CGPath，可以直接get（点语法）方法拿到。（想象一下UIColor和CGColor）。
- CGContextStrokePath ：把上下文的内容显示出来，参数就是上下文。
4：画其他
- 画第二根线
1.1 第一种方法:重新设置起点,添加一根线到某个点,一个UIBezierPath路径上面可以有多条线.
1.2 第二种方法:直接在原来的基础上添加线.把上一条的终点当做下一条线的起点.添加一根线到某个点，直接在下面addLineToPoint:
宽度,颜色,样式
设置这些样式,我们称为是修改图形上下文的状态.
设置线宽:CGContextSetLineWidth(ctx, 20);
设置线段的连接样式: CGContextSetLineJoin(ctx, kCGLineJoinRound);
添加顶角样式:CGContextSetLineCap(ctx, kCGLineCapRound);
设置线的颜色: [[UIColor redColor] setStroke];-
画曲线
画曲线方法比较特殊需要一个控制点来决定曲线的弯曲程度。画曲线方法为:
- 先设置一个曲线的起点
[path moveToPoint:CGPointMake(10, 125)];
2.再添加到个点到曲线的终点.同时还须要一个controlPoint(控件点决定曲线弯曲的方法程序)
[path addQuadCurveToPoint:CGPointMake(240, 125) controlPoint:CGPointMake(125, 10)];
- 画矩形
画矩形直接利用UIBezierPath给我们封装好的路径方法
- (x,y)点决定了矩形左上角的点在哪个位置。
- (width,height)是矩形的宽度高度。
- bezierPathWithOvalInRect:CGRectMake(x, y, width, height)。
- 圆角矩形的画法多了一个参数,cornerRadius。
- cornerRadius它是矩形的圆角半径。
- 通过圆角矩形可以画一个圆.当矩形是正方形的时候,把圆角半径设为宽度的一半,就是一个圆。
- bezierPathWithRoundedRect:CGRectMake(10, 100, 50, 50) cornerRadius:10
- 画圆
画椭圆的方法为:
- 前两个参数分别代码圆的圆心,后面两个参数分别代表圆的宽度,与高度（其实就是根据一个矩形定义一个圆）
- 宽高都相等时,画的是一个正圆, 不相等时画的是一个椭圆
bezierPathWithOvalInRect:CGRectMake(10, 100, 50, 50)
- 利用UIKit封装的上下文进行画图
- 直接用**[path stroke]**就可以了。
- 它底层的实现,就是获取上下文,拼接路径,把路径添加到上下文,渲染到View。
- 画圆弧
首先要确定圆才能确定圆弧,圆孤它就是圆上的一个角度
/**
Center:圆心
radius:圆的半径
startAngle:起始角度
endAngle:终点角度
clockwise:Yes顺时针,No逆时针
*/
[UIBezierPath bezierPathWithArcCenter:(CGPoint)
radius:(CGFloat)
startAngle:(CGFloat)
endAngle:(CGFloat)
clockwise:(BOOL)]
- 画扇形
画扇形的方法为:
- 先画一个圆孤再添加一个一根线到圆心,然后关闭路径.
- 关闭路径就会自动从路径的终点到路径的起点封闭起下
- 用填充的话,它会默认做一个封闭路径,从路径的终点到起点.
[path fill];