iOS 2D绘图详解（Quartz 2D）之路径(stroke,fill,clip,subpath,blend)-白红宇

iOS 2D绘图详解（Quartz 2D）之路径(stroke,fill,clip,subpath,blend)

阅读量：6507 次

发布时间：2019-06-24

本文共 2947 字，大约阅读时间需要 9 分钟。

Stroke-描边

影响描边的因素

线的宽度－CGContextSetLineWidth

交叉线的处理方式－CGContextSetLineJoin

线顶端的处理方式－CGContextSetLineCap

进一步限制交叉线的处理方式－CGContextSetMiterLimit

是否要虚线－Line dash pattern

颜色控件－CGContextSetStrokeColorSpace

画笔颜色－CGContextSetStrokeColor/CGContextSetStrokeColorWithColor

描边模式－CGContextSetStrokePattern

虚线，画笔颜色，交叉的处理方式，顶端的处理方式，线宽度在之前里有讲过，这里不再赘述。

CGContextSetMiterLimit

如果当前交叉线绘图模式是kCGLineJoinMiter( CGContextSetLineJoin)，quartz根据设置的miter值来判断线的join是bevel或者miter。具体的模式是：将miter的长度除以线的宽度，如果小于设置的mitetLimit值，则join style为bevel；

先看看三种join效果

举个例子就懂了

CGContextMoveToPoint(context,10,10);    CGContextAddLineToPoint(context, 50, 50); CGContextAddLineToPoint(context, 10, 90); CGContextSetLineWidth(context, 10.0); CGContextSetLineJoin(context, kCGLineJoinMiter); CGContextSetMiterLimit(context,20.0); CGContextStrokePath(context);

效果

将Miter设置为1，则效果如下

CGContextSetStrokeColorSpace和pattern会在以后的文章详细阐述，这里暂时先略去

Fill－填充

Quartz填充的时候会认为subpath是封闭的，然后根据规则来填充。有两种规则：

nonzero winding number rule.沿着当前点，画一条直线到区域外，检查交叉点，如果交叉点从左到右，则加一，从右到左，则减去一。如果结果不为0，则绘制。参见这个

even-odd rule,沿着当前点，花一条线到区域外，然后检查相交的路径，偶数则绘制，奇数则不绘制。
具体效果如下

Clip－切割

顾名思义，根据path只绘制指定的区域，在区域外的都不会绘制。

举个例子，截取圆形区域

效果

注意，切割是和状态相关的，以为这切割以后都是在切割后context中绘制的。

如果要保存状态，参照这篇文章里讲的压栈和出栈

- (void)drawRect:(CGRect)rect {    CGContextRef context = UIGraphicsGetCurrentContext();    CGContextBeginPath (context);    CGContextAddArc(context,50, 50,20,0, M_PI * 2,true); CGContextClosePath (context); CGContextClip (context); CGContextSetFillColorWithColor(context, [UIColor lightGrayColor].CGColor); CGContextFillRect(context, rect); //New Code CGContextSetStrokeColorWithColor(context, [UIColor whiteColor].CGColor); CGContextMoveToPoint(context,10,10); CGContextAddLineToPoint(context, 50, 50); CGContextAddLineToPoint(context, 10, 90); CGContextSetLineWidth(context, 10.0); CGContextSetLineJoin(context, kCGLineJoinMiter); CGContextSetMiterLimit(context,20.0); CGContextStrokePath(context); } -(instancetype)initWithFrame:(CGRect)frame{ if (self = [super initWithFrame:frame]) { self.opaque = NO; } return self; }