关于遮罩层的实现方法之一

因为项目用到了遮罩功能，所以自己研究了一番，决定用CAShapeLayer来实现效果。

 

CAShapeLayer是用来接受矢量Path，直接使用GPU来进行渲染的特殊图层。看下面效果：

对应代码：

1 2 3 4 5 6 7 8 9

let markLayer = CAShapeLayer(); markLayer.frame = self.view.bounds;// layer的位置 markLayer.fillColor = UIColor(colorLiteralRed: 0, green: 0, blue: 0, alpha: 0.3).CGColor;// layer的填充颜色，这里设置了透明度 markLayer.fillRule = kCAFillRuleEvenOdd; //填充规则，稍后会解释   let path = CGPathCreateMutable(); CGPathAddRect(path, nil, self.subLayer.bounds); CGPathAddEllipseInRect(path, nil, CGRectMake(0, self.view.frame.size.height / 2 - 50, self.view.frame.size.width, 200 )); markLayer.path = path; //设置要渲染的Path

1	self.view.layer.addSublayer(markLayer);

我们生成了由一个矩形内嵌一个椭圆而形成的Path,然后交由CAShapeLayer渲染。中间椭圆呈现空心的原因是因为我们设置了fillRule为kCAFillRuleEvenOdd. 下面解释下fillRule的作用于用法。由于Path可以表示很复杂的形状，CAShapeLayer在做填充时必须要区分哪些是属于内部填充区域，哪些是外部非填充区域。内部填充区域会以填充色填充。区分的方法如下：

从某一区域内部选一个点，画一条射线到path的边界以外，对射线与Path的交点进行统计，然后根据fillMode的设置来确定该区域属于内部填充区域还是外部非填充区域。

fillMode = kCAFillRuleNonZero

fillMode = kCAFillRuleEvenOdd

回到文章开始的示例，中间的椭圆区域内的店到Path边界外的射线与Path的交点有两个(椭圆和矩形的边)，因此椭圆区域为外部非填充区域。而矩形与椭圆之间区域则为内部填充区域。