首先介绍一下使用Quartz2D能做些什么：
- 绘制图形 : 线条\三角形\矩形\圆\弧等；
- 绘制文字；
- 绘制\生成图片(图像)；
- 读取\生成PDF；
- 截图\裁剪图片；
- 自定义UI控件；
图形上下文
图形上下文（Graphics Context）：是一个CGContextRef类型的数据。
图形上下文的作用：
- （1）保存绘图信息、绘图状态
- （2）决定绘制的输出目标（绘制到什么地方去？）
（输出目标可以是PDF文件、Bitmap或者显示器的窗口上）相同的一套绘图序列，指定不同的Graphics Context，就可将相同的图像绘制到不同的目标上。
Quartz2D提供了以下几种类型的Graphics Context：
- （1）Bitmap Graphics Context
- （2）PDF Graphics Context
- （3）Window Graphics Context
- （4）Layer Graphics Context
- （5）Printer Graphics Context
使用Quartz2D自定义View
步骤：
- (1)新建一个类，继承自UIView
- (2)实现
-(void)drawRect:(CGRect)rect方法，然后在这个方法中取得跟当前view相关联的图形上下文
CGContextRef ctx = UIGraphicsGetCurrentContext(); - (3)绘制相应的图形内容
画扇形
- (void)drawRect:(CGRect)rect {
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextMoveToPoint(ctx, 100, 100);
CGContextAddLineToPoint(ctx, 100, 150);
CGContextAddArc(ctx, 100, 100, 50, -M_PI_2, M_PI_2, 1);
CGContextClosePath(ctx);
[[UIColor redColor] set];
CGContextFillPath(ctx);
}
** 注：**
//M_PI的含义:π
//M_PI * 2的含义:2π
//M_PI_2的含义:π/2
//M_PI / 2的含义:π/2
// 画的图形路径
//bezierPathWithArcCenter:弧所在的圆心
//radius:圆的半径
//startAngle:开始角度,圆的最右侧为0度
//endAngle:截至角度,向下为正,向上为负.
//clockwise:时针的方向,yes:顺时针 no:逆时针
`UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:self.center radius:radius startAngle:startA endAngle:endA clockwise:NO];`
注意4点:
- 手动调用drawRect:方法，不会自动创建跟View相关联的上下文。应该调用setNeedsDisplay方法,系统底层会自动调用drawRect，告诉系统重新绘制View.这样，系统底层会自动创建跟View相关联的上下文
- setNeedsDisplay底层会调用drawRect,并不是立马调用的.只是设了一个调用的标志.调用时刻是等下一次屏幕刷新时才去调用drawRect。屏幕每一秒刷新30-60秒次,所以1秒调用drawRect方法大概30-60次,速度非常快哦
- view内部有个layer（图层）属性，drawRect:方法中取得的是一个Layer Graphics Context，因此，绘制的东西其实是绘制到view的layer上去了
- View之所以能显示东西，完全是因为它内部的layer
Quartz2D重要函数
常用拼接路径函数
-
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)添加一个圆弧
常用绘制路径函数
一般以CGContextDraw、CGContextStroke、CGContextFill开头的函数，都是用来绘制路径的。
-
voidCGContextDrawPath(CGContextRef c, CGPathDrawingMode mode)Mode参数决定绘制的模式 -
voidCGContextStrokePath(CGContextRef c)绘制空心路径 -
voidCGContextFillPath(CGContextRef c)绘制实心路径
矩阵操作函数
利用矩阵操作，能让绘制到上下文中的所有路径一起发生变化。
- 缩放：
void CGContextScaleCTM(CGContextRef c, CGFloat sx, CGFloat sy) - 旋转:
void CGContextRotateCTM(CGContextRef c, CGFloat angle) - 平移:
void CGContextTranslateCTM(CGContextRef c, CGFloat tx, CGFloat ty)
其他常用函数
- 设置线段宽度:
CGContextSetLineWidth(ctx, 10); - 设置线段头尾部的样式：
CGContextSetLineCap(ctx, kCGLineCapRound); - 设置线段转折点的样式:
CGContextSetLineJoin(ctx, kCGLineJoinRound); - 设置颜色 :
CGContextSetRGBStrokeColor(ctx, 1, 0, 0, 1);
画矩形，正方形
- (void)drawRect:(CGRect)rect {
//1.获取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.描述路径
UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(50, 50, 200, 200)];
//3.把路径添加到上下文
CGContextAddPath(ctx, path.CGPath);
[[UIColor redColor] set];// 路径的颜色
CGContextSetLineWidth(ctx, 10);
//4.把上下文的内容渲染到View的layer.
//CGContextStrokePath(ctx);// 描边路径
CGContextStrokePath(ctx);// 填充路径
}
画圆形
- (void)drawRect:(CGRect)rect {
//1.获取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.描述路径
// cornerRadius:圆角半径。矩形的宽高都为200，如果圆角为100，那么两个角之间弧线上任意一点到矩形中心的距离都为100,所以为圆形
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(50, 50, 200, 200) cornerRadius:100];
//3.把路径添加到上下文
CGContextAddPath(ctx, path.CGPath);
[[UIColor redColor] set];// 路径的颜色
//4.把上下文的内容渲染到View的layer.
// CGContextStrokePath(ctx);// 描边路径
CGContextFillPath(ctx);// 填充路径
}
画圆角矩形
- (void)drawRect:(CGRect)rect {
//1.获取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.描述路径
// cornerRadius:圆角半径。
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(50, 50, 200, 200) cornerRadius:50];
//3.把路径添加到上下文
CGContextAddPath(ctx, path.CGPath);
[[UIColor redColor] set];// 路径的颜色
//4.把上下文的内容渲染到View的layer.
CGContextStrokePath(ctx);// 描边路径
//CGContextFillPath(ctx);// 填充路径
}
画直线
- (void)drawRect:(CGRect)rect {
//1.获取跟View相关联的上下文(uigraphics开头)
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.描述路径
//一条路径可以绘制多条线 路径:path 路径绘制多条线:path使用了两次（2次的起点到终点），都是将线添加到某个点
UIBezierPath *path = [UIBezierPath bezierPath];
//设置起点
[path moveToPoint:CGPointMake(50, 150)];
//添加一根线Line到某个点
[path addLineToPoint:CGPointMake(250, 50)];
//画第二根线
[path moveToPoint:CGPointMake(50, 250)];
[path addLineToPoint:CGPointMake(250, 100)];
//设置线宽
CGContextSetLineWidth(ctx, 20);
//设置线的连接样式
CGContextSetLineJoin(ctx, kCGLineJoinBevel);
//设置线的顶角样式
CGContextSetLineCap(ctx, kCGLineCapRound);// 圆角线条
//设置线条颜色
[[UIColor redColor] set];
//3.把路径添加到上下文
CGContextAddPath(ctx, path.CGPath);
//4.把上下文当中绘制的内容渲染到跟View关联的layer
CGContextStrokePath(ctx);
}
绘制文字
- (void)drawRect:(CGRect)rect {
NSString *str = @"HelloWorld";
NSMutableDictionary *dict = [NSMutableDictionary dictionary];
//设置字体
dict[NSFontAttributeName] = [UIFont systemFontOfSize:30];
//设置颜色
dict[NSForegroundColorAttributeName] = [UIColor redColor];
//设置描边
dict[NSStrokeColorAttributeName] = [UIColor blueColor];
dict[NSStrokeWidthAttributeName] = @3;
//设置阴影
NSShadow *shadow = [[NSShadow alloc] init];
shadow.shadowColor = [UIColor greenColor];
shadow.shadowOffset = CGSizeMake(-2, -2);
shadow.shadowBlurRadius = 3;
dict[NSShadowAttributeName] = shadow;
//设置文字的属性
//drawAtPoint不会自动换行
//[str drawAtPoint:CGPointMake(0, 0) withAttributes:dict];
//drawInRect会自动换行
[str drawInRect:self.bounds withAttributes:dict];
}
