iOS开发笔记之绘图
前言
绘图涉及到的知识点：
Quartz2D
----DrawRect
CALayer
----CAShapeLayer
UIBezierPath
绘图的方式：
1、通过Quartz2D框架，自定义view，实现view的drawRect方法就可以画出一些想要的图形。
2、使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形。
3、其他（暂时不讲）
概念解析
1、Quartz2D
提到iOS中的绘图，必然会想到Quartz2D,Quzrtz2D是一个二维绘图引擎，支持iOS和Mac系统。Quartz2D的API来源于CoreGraphics框架。
2、CAShapeLayer
CAShapeLayer继承与CALayer，因此，可使用CALayer的所有属性。但是CAShapeLayer需要和贝塞尔曲线（UIBezierPath）配合才有意义
主要属性：
// CAShapeLayer 绘制的路径
@property(nullable) CGPathRef path;
//路径中的填充颜色
@property(nullable) CGColorRef fillColor;
//填充规则
@property(copy) NSString *fillRule;
//画笔颜色（路径的颜色，边框颜色）
@property(nullable) CGColorRef strokeColor;
//这是一组范围值，路径绘制开始和结束的范围（0 -> 1）
@property CGFloat strokeStart;
@property CGFloat strokeEnd;
//设置虚线显示的起点距离，设置为8，则显示长度8之后的线
@property CGFloat lineDashPhase;
//设置虚线线段的长度和空格的长度，@[@20,@30,@40,@50],画20空30画40空50
@property(nullable, copy) NSArray
** CAShapeLayer与drawRect的比较：**
1、drawRect属于CoreGraphics框架，占用CPU,性能消耗大；
2、CAShapeLayer属于CoreAnimation框架，通过GPU来渲染图形，节省性能；动画渲染直接提交给GPU，不消化内存；
**1、温馨提示：drawRect只是一个方法而已，是UIView的方法，重写此方法可以完成绘图功能
2、CAShapeLayer动画仅仅限于沿着边缘的动画效果，它实现不了填充效果 **
3、UIBezierPath
UIBezierPath是在UIKit中的一个类，继承于NSObject,可以创建矢量路径，此类是CoreGraphics框架关于path的一个OC封装。所以本质两者相同，只是UIBezierPath更加好用
+ (instancetype)bezierPath;
+ (instancetype)bezierPathWithRect:(CGRect)rect;
+ (instancetype)bezierPathWithOvalInRect:(CGRect)rect;
+ (instancetype)bezierPathWithRoundedRect:(CGRect)rect cornerRadius:(CGFloat)cornerRadius; // rounds all corners with the same horizontal and vertical radius
+ (instancetype)bezierPathWithRoundedRect:(CGRect)rect byRoundingCorners:(UIRectCorner)corners cornerRadii:(CGSize)cornerRadii;
+ (instancetype)bezierPathWithArcCenter:(CGPoint)center radius:(CGFloat)radius startAngle:(CGFloat)startAngle endAngle:(CGFloat)endAngle clockwise:(BOOL)clockwise;
+ (instancetype)bezierPathWithCGPath:(CGPathRef)CGPath;
CAShapeLayer与UIBezierPath的关系：
- 1、CAShapeLayer中的shape代表形状的意思，所以要形状才能生效
- 2、贝塞尔曲线（UIBezierPath）创建矢量路径，UIBezierPath雷士多CGPathRef的封装；
- 3、贝塞尔曲线（UIBezierPath）提供路径，CAShapeLayer在提供的路径中进行渲染，路径闭环，所以绘制出了shape;
- 4、用于CAShapeLayer的贝塞尔曲线一定是闭环，即使贝塞尔曲线（UIBezierPath）不是一个闭环的曲线
Quartz2D能完成的工作：
- 绘制图形：线条、三角形、矩形、弧形等等
- 绘制文字
- 绘制/生成图片
- 读取和生成PDF
- 截图裁剪图片
- 自定义UI控件
CAShapeLayer能完成的工作：
使用CAShapeLayer(属于CoreAnimation)与贝塞尔曲线可以实现不在view的drawRect（继承于CoreGraphics走的是CPU,消耗的性能较大）方法中画出一些想要的图形
绘图的基本步骤：
//绘制直线
- (void)drawRect:(CGRect)rect
{
// 1.取得和当前视图相关联的图形上下文(因为图形上下文决定绘制的输出目标)/
// 如果是在drawRect方法中调用UIGraphicsGetCurrentContext方法获取出来的就是Layer的上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2、设置绘图状态
// 设置线条颜色 红色
CGContextSetRGBStrokeColor(ctx, 1.0, 0, 0, 1.0);
// 设置线条宽度
CGContextSetLineWidth(ctx, 10);
// 设置线条的起点和终点的样式
CGContextSetLineCap(ctx, kCGLineCapRound);
// 设置线条的转角的样式
CGContextSetLineJoin(ctx, kCGLineJoinRound);
// 3.拼接路径绘图(绘制直线)
// 设置起点
CGContextMoveToPoint(ctx, 10, 10);
// 设置终点
CGContextAddLineToPoint(ctx, rect.size.width - 10, 10);
//3、保存绘图信息（渲染）
// 绘制一条空心的线
CGContextStrokePath(ctx);
}
生成水印图：
+ (instancetype)imageWithBackgroundImageName:(NSString *)bgName log:(NSString *)logNmae
{
// 0. 加载背景图片
UIImage *image = [UIImage imageNamed:bgName];
// 1.创建bitmap上下文
// 执行完这一行在内存中就相遇创建了一个UIImage
UIGraphicsBeginImageContextWithOptions(image.size, NO, 0);
// 2.绘图图片
// 绘制背景图片
[image drawAtPoint:CGPointMake(0, 0)];
// 绘制水印'
UIImage *logImage = [UIImage imageNamed:logNmae];
CGFloat margin = 10;
CGFloat logY = margin;
CGFloat logX = image.size.width - margin - logImage.size.width;
[logImage drawAtPoint:CGPointMake(logX, logY)];
// NSString *str = @"哈哈哈";
// [str drawAtPoint:CGPointMake(150, 50) withAttributes:nil];
// 3.获得图片
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
return newImage;
}
截图裁剪图片:
CAShapeLayer结合UIBezierPath绘图的基本步骤：
未完待续。。。。。
