美文网首页iOS记录篇iOS Developer - AnimationiOS 深度好文
iOS 利用CAShapeLayer的FillRule属性生成一

iOS 利用CAShapeLayer的FillRule属性生成一

作者: keep_moving | 来源:发表于2016-03-25 21:20 被阅读4583次

1.空心矩形框:
通过设置填充规则为kCAFillRuleEvenOdd,绘制两个Rect的非交集

  UIView* aView = [[UIView alloc] initWithFrame:CGRectMake(100,80, 100, 100)];
  [self.view addSubview:aView];
  //用来标识layer的绘图是否正确
  aView.layer.borderWidth = 1.0;
  aView.layer.borderColor = [UIColor blackColor].CGColor;
  CAShapeLayer* cropLayer = [[CAShapeLayer alloc] init];
  [aView.layer addSublayer:cropLayer];
  // 创建一个绘制路径
  CGMutablePathRef path =CGPathCreateMutable();
  // 空心矩形的rect
  CGRect cropRect = CGRectMake(20, 30, 60, 40);
  // 绘制rect
  CGPathAddRect(path, nil, aView.bounds);
  CGPathAddRect(path, nil, cropRect);
  // 设置填充规则(重点)
  [cropLayer setFillRule:kCAFillRuleEvenOdd];
  // 关联绘制的path
  [cropLayer setPath:path];
  // 设置填充的颜色
  [cropLayer setFillColor:[[UIColor redColor] CGColor]];

效果图 :

1.png

2.空心圆:
通过设置填充规则为kCAFillRuleEvenOdd,绘制Rect和Arc的非交集

     CAShapeLayer *pShapeLayer = [CAShapeLayer layer];
     pShapeLayer.fillColor = [UIColor blackColor].CGColor;[self.overlayView.layer addSublayer:pShapeLayer];UIBezierPath *pPath = [UIBezierPath bezierPathWithArcCenter:self.overlayView.center radius:SCALE_FRAME_Y/2 startAngle:0.0 endAngle:M_PI*2 clockwise:YES];
     pShapeLayer.path = pPath.CGPath;

     UIBezierPath *pOtherPath = [UIBezierPath bezierPathWithRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
     pShapeLayer.path = pOtherPath.CGPath;

     [pOtherPath appendPath:pPath];
     pShapeLayer.path = pOtherPath.CGPath;
           //重点
     pShapeLayer.fillRule = kCAFillRuleEvenOdd;

效果图:


2.png

重点:理解填充规则 fillRule

/* The fill rule used when filling the path. Options are `non-zero' and
 * `even-odd'. Defaults to `non-zero'. */
@property(copy) NSString *fillRule; ```
     
属性用于指定使用哪一种算法去判断画布上的某区域是否属于该图形“内部” (内部区域将被填充)。对一个简单的无交叉的路径,哪块区域是“内部” 是很直观清除的。但是,对一个复杂的路径,比如自相交或者一个子路径包围另一个子路径,“内部”的理解就不那么明确了。

`kCAFillRuleNonZero`
     字面意思是“非零”。按该规则,要判断一个点是否在图形内,从该点作任意方向的一条射线,然后检测射线与图形路径的交点情况。从0开始计数,路径从左向右穿过射线则计数加1,从右向左穿过射线则计数减1。得出计数结果后,如果结果是0,则认为点在图形外部,否则认为在内部。下图演示了kCAFillRuleNonZero规则:
![3.png](https://img.haomeiwen.com/i833634/f1b5b4a0052db40e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

`kCAFillRuleEvenOdd`
     字面意思是“奇偶”。按该规则,要判断一个点是否在图形内,从该点作任意方向的一条射线,然后检测射线与图形路径的交点的数量。如果结果是奇数则认为点在内部,是偶数则认为点在外部。下图演示了kCAFillRuleEvenOdd 规则:
![4.png](https://img.haomeiwen.com/i833634/f522192d09f24ff0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

原文链接:[http://keepmovingxin.com/archives/21](http://keepmovingxin.com/archives/21)

相关文章

网友评论

  • 卓敦:楼主,一张图片,我想在图片中间弄个不规则的图形,然后除了不规则图形,其他部分都弄透明,怎么弄
  • ca967f2533f1:Hi, 你好, 我想知道你文章最后的 kCAFillRuleNonZero 和 kCAFillRuleEvenOdd 的资料是在哪里找到的?是官方文档么,具体名字是? 谢谢了
    旭丶Joy:https://developer.apple.com/documentation/quartzcore/cashapelayer/shape_fill_mode_values?language=objc
  • 李国安:好文好文。 留下了
    更多 iOS 开发相关文章请关注: http://www.jianshu.com/collection/e84a7722d673

本文标题:iOS 利用CAShapeLayer的FillRule属性生成一

本文链接:https://www.haomeiwen.com/subject/kildlttx.html