Quartz2D基本图形绘制
- 苹果封装了一套绘图的函数库
- 开发中比较常用的截屏、裁剪、自定义UI控件
- Quartz2D在iOS开发中的价值就是自定义控件
绘图步骤
- 获取上下文
- 创建路径
- 把路径添加到上下文
- 渲染上下文
drawRect:方法中绘制图形
- 因为只有在这个方法中才能获取到图形上下文
- 当这个view要显示的时候才会调用drawRect绘制图形
绘制直线
1、最原始的方法
//1.获取图形上下文
// 目前我们所用的上下文都是UIGraphics
// CGContextRef Ref:引用 CG:目前使用到的类型和函数,一般都是CG开头 CoreGraphics
CGContextRef ctx = UIGraphicsGetCurrentContext();
//2.描述路径
// 创建路径
CGMutablePathRef path = CGPathCreateMutable();
//设置起点
CGPathMoveToPoint(path, NULL, 50, 50);
//添加一根线到某个点
CGPathAddLineToPoint(path, NULL, 200, 100);
//3. 把路径添加到上下文
CGContextAddPath(ctx, path);
//4. 渲染上下文
CGContextStrokePath(ctx);
2、简单方法
// 获取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 描述路径
CGContextMoveToPoint(ctx, 20, 20);
CGContextAddLineToPoint(ctx, 200, 200);
CGContextStrokePath(ctx);
3、使用贝塞尔路径
// 贝塞尔路径
UIBezierPath *path = [UIBezierPath bezierPath];
//设置起点
[path moveToPoint:CGPointMake(10, 20)];
//添加一根线到某个点
[path addLineToPoint:CGPointMake(200, 100)];
//绘制路径
[path stroke];
绘制两条线、设置属性
1、使用上下文
// 获取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 描述路径
CGContextMoveToPoint(ctx , 20, 20);
CGContextAddLineToPoint(ctx, 100, 50);
CGContextMoveToPoint(ctx, 100, 50);
CGContextAddLineToPoint(ctx, 100, 100);
// 设置绘图状态,一定要在渲染之前
// 颜色
[[UIColor redColor] setStroke];
// 线宽
CGContextSetLineWidth(ctx, 5);
// 设置链接样式
CGContextSetLineJoin(ctx, kCGLineJoinRound);
// 设置顶角样式
CGContextSetLineCap(ctx, kCGLineCapRound);
// 渲染上下文
CGContextStrokePath(ctx);
2、使用贝塞尔路径
UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(50, 50)];
[path addLineToPoint:CGPointMake(200, 200)];
path.lineWidth = 10;
[[UIColor redColor] set];
path.lineCapStyle = kCGLineCapRound;
path.lineJoinStyle = kCGLineJoinRound;
[path stroke];
UIBezierPath *path1 = [UIBezierPath bezierPath];
[path1 moveToPoint:CGPointMake(0, 0)];
[path1 addLineToPoint:CGPointMake(30, 60)];
[[UIColor greenColor] set];
path1.lineJoinStyle = kCGLineJoinRound;
path1.lineCapStyle = kCGLineCapRound;
path1.lineWidth = 3;
[path1 stroke];
绘制曲线
// 获取上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 描述路径
// 设置起点
CGContextMoveToPoint(ctx, 50, 50);
// cpx:控制点的x
// cpy:控制点的y
CGContextAddQuadCurveToPoint(ctx, 200, 300, 250, 50);
// 渲染上下文
CGContextStrokePath(ctx);
绘制圆角矩形
// 圆角矩形
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 20, 200, 200) cornerRadius:20];
[[UIColor redColor] set];
// 只画边框
[path stroke];
// 填充
[path fill];
绘制扇形
// 扇形
// Center:圆心
// startAngle:弧度
// clockwise:YES:顺时针 NO:逆时针
CGPoint center = CGPointMake(125, 125);
UIBezierPath *path1 = [UIBezierPath bezierPathWithArcCenter:center radius:100 startAngle:0 endAngle:M_PI_2 clockwise:YES];
[path1 addLineToPoint:center];
// 封闭路径,关闭路径:从路径的终点到起点
//[path1 closePath];
[path1 stroke];
//填充:必须是一个完整的封闭路径,默认就会自动关闭路
[path1 fill];
绘制圆形
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(1, 1, 100, 100)];
[path stroke];
注意:drawRect不能手动调用,因为图形上下文我们自己创建不了,只能由系统帮我们创建,并且传递给我们,只能使用下面的方法进行重绘
// 重绘,系统会先创建与view相关联的上下文,然后再调用drawRect
[self setNeedsDisplay];