- Quarz2D可以实现以下内容:
绘制图形:线条/三角形/矩形/圆/弧形/扇形等
绘制文字
绘制/生成图片
读取/生成PDF
截图/裁剪图片
自定义UI控件
- Quarz2D绘制四大步骤:
1.获取当前view的图形上下文
2.描述路径
3.将路径添加到上下文
4.渲染上下文
- Quarz2D只能在DrawRect方法中实现(需自定义View)
第一种绘制方法:
- (void)drawRect:(CGRect)rect {
// Drawing code
//获取图形上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//创建路径
CGMutablePathRef path = CGPathCreateMutable();
//设置起点
CGPathMoveToPoint(path, NULL, 100, 100);
//设置终点
CGPathAddLineToPoint(path, NULL, 200, 200);
//将路径添加至图形上下文
CGContextAddPath(ctx, path);
//渲染上下文
CGContextStrokePath(ctx);
}
效果图:
第二种绘制方法:
- (void)drawRect:(CGRect)rect {
// Drawing code
//获取图形上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
//设置起点
CGContextMoveToPoint(ctx, 100, 100);
//设置终点
CGContextAddLineToPoint(ctx, 200, 100);
//渲染到图形上下文
CGContextStrokePath(ctx);
}
效果图:
第三种绘制方法:
- (void)drawRect:(CGRect)rect {
// Drawing code
//创建路径
UIBezierPath *path = [[UIBezierPath alloc] init];
//设置起点
[path moveToPoint:CGPointMake(50, 100)];
//设置终点
[path addLineToPoint:CGPointMake(100, 100)];
//渲染上下文
[path stroke];
}
效果图:
绘制多条路径:
- (void)drawRect:(CGRect)rect {
// Drawing code
CGContextRef ctx = UIGraphicsGetCurrentContext();
//设置起点
CGContextMoveToPoint(ctx, 100, 100);
//设置终点
CGContextAddLineToPoint(ctx, 200, 100);
//设置终点
CGContextAddLineToPoint(ctx, 150, 150);
//渲染到图形上下文
CGContextStrokePath(ctx);
}
效果图:
使用UIBezierPath绘制多条路径:
- (void)drawRect:(CGRect)rect {
// Drawing code
//创建路径
UIBezierPath *path = [[UIBezierPath alloc] init];
//设置起点
[path moveToPoint:CGPointMake(50, 100)];
//设置终点
[path addLineToPoint:CGPointMake(100, 100)];
//渲染上下文
[path stroke];
//创建路径
UIBezierPath *path1 = [[UIBezierPath alloc] init];
//设置起点
[path1 moveToPoint:CGPointMake(100, 50)];
//设置终点
[path1 addLineToPoint:CGPointMake(150, 150)];
//渲染上下文
[path1 stroke];
}
效果图:
设置路径样式:
- (void)drawRect:(CGRect)rect {
// Drawing code
CGContextRef ctx = UIGraphicsGetCurrentContext();
//设置起点
CGContextMoveToPoint(ctx, 100, 100);
//设置终点
CGContextAddLineToPoint(ctx, 200, 100);
//设置终点
CGContextAddLineToPoint(ctx, 150, 150);
//设置颜色
[[UIColor redColor] set];
//设置线宽
CGContextSetLineWidth(ctx, 10);
//设置线样式
CGContextSetLineJoin(ctx, kCGLineJoinRound);
//渲染到图形上下文
CGContextStrokePath(ctx);
}
效果图:
使用UIBezierPath设置样式:
- (void)drawRect:(CGRect)rect {
// Drawing code
UIBezierPath *path = [[UIBezierPath alloc] init];
//设置起点
[path moveToPoint:CGPointMake(50, 100)];
//设置终点
[path addLineToPoint:CGPointMake(100, 100)];
//设置红色
[[UIColor redColor] set];
//渲染上下文
[path stroke];
//创建路径
UIBezierPath *path1 = [[UIBezierPath alloc] init];
//设置起点
[path1 moveToPoint:CGPointMake(100, 50)];
//设置终点
[path1 addLineToPoint:CGPointMake(150, 150)];
//设置橙色
[[UIColor orangeColor] set];
//渲染上下文
[path1 stroke];
}
效果图:
绘制曲线:
- (void)drawRect:(CGRect)rect {
//创建路径
CGContextRef ctx = UIGraphicsGetCurrentContext();
//设置起点
CGContextMoveToPoint(ctx, 20, 20);
//绘制曲线 控制点x 控制点y 终点x 终点y
CGContextAddQuadCurveToPoint(ctx, 50, 50, 20, 100);
//渲染上下文
CGContextStrokePath(ctx);
}
效果图:
绘制图形:
- (void)drawRect:(CGRect)rect {
//绘制矩形
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 20, 100, 100)cornerRadius:20];
//描边
[path stroke];
//填充
[path fill];
}
效果图:
描边
填充
绘制圆形:
- (void)drawRect:(CGRect)rect {
/*
Center:圆心
startAngle:弧度
clockwise:YES:顺时针 NO:逆时针
*/
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 100) radius:100 startAngle:0 endAngle:M_PI * 2 clockwise:YES];
//描边
[path stroke];
//填充会自动补齐路径
[path fill];
}
效果图:
绘制圆弧:
- (void)drawRect:(CGRect)rect {
/*
Center:圆心
startAngle:弧度
clockwise:YES:顺时针 NO:逆时针
*/
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 100) radius:100 startAngle:0 endAngle:M_PI_2 clockwise:YES];
//描边
[path stroke];
//填充会自动补齐路径
[path fill];
}
效果图:
闭合弧形路径:
- (void)drawRect:(CGRect)rect {
/*
Center:圆心
startAngle:弧度
clockwise:YES:顺时针 NO:逆时针
*/
CGPoint center = CGPointMake(50, 50);
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 100) radius:100 startAngle:0 endAngle:M_PI_2 clockwise:YES];
//描边
[path addLineToPoint:center];
//关闭路径(关闭路径方式1)
[path close];
//填充会自动补齐路径(关闭路径方式2)
[path fill];
}
效果图:
