刚开始想做这样的遮罩效果,然后呢?看了一下view 里面的属性有maskView,然后踩了一些坑说一下:
1.如果maskView 不起作用,那请设置一下maskView的背景颜色。
2.当一个view设置了maskView后,那么它只会显示与maskView重叠并且有颜色的部分。如下图:
CGFloat maskY = (SCREEN_HEIGHT - (SCREEN_WIDTH - 40)/0.618) * .5;
CGFloat maskX = 20;
CGFloat maskW = SCREEN_WIDTH - 40;
CGFloat maskH = (SCREEN_WIDTH - 40)/0.618;
UIView *maskV = [[UIView alloc] initWithFrame:CGRectMake(maskX, maskY, maskW, maskH)];
maskV.layer.cornerRadius = 10.;
maskV.layer.masksToBounds = YES;
maskV.backgroundColor = [UIColor whiteColor];
self.blurView.maskView = maskV;
等效于:self.blurView.layer.mask = maskView.layer;
显然不符合我们的需求
下面是正解:原理是使用 layer.mask ,它也是只会显示重叠并且有颜色的部分。
所以我们要生成这样的一个layer,如下图:
然后 QuartzCore 这个框架里面,有一个叫 CAShapeLayer,(主要用于设置图层的形状),配合路径(CGPath)使用。下面主要配合贝塞尔曲线UIBezierPath使用。然后设置给 layer.mask 即可。
相对于Core Graphics绘制图片,它还有几个优点:
1.、渲染快速。CAShapeLayer使用了硬件加速(使用CPU渲染),绘制同一图形会比用Core Graphics快很多
2、高效使用内存。一个CAShapeLayer不需要像普通CALayer一样创建一个寄宿图形,所以无论有多大,都不会占用太多的内存。
3、不会被图层边界剪裁掉。一个CAShapeLayer可以在边界之外绘制。
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
[shapeLayer setFillColor:[[UIColor blueColor] CGColor]];
UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(0,0, SCREEN_WIDTH, SCREEN_HEIGHT)];
UIBezierPath *cropPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(maskX, maskY, maskW, maskH) cornerRadius:10];
[path appendPath:cropPath];
shapeLayer.fillRule = kCAFillRuleEvenOdd;
shapeLayer.path = path.CGPath;
//[self.blurView.layer addSublayer:shapeLayer];//添加看图层效果,把下面的注释了。要不然。看不到
self.blurView.layer.mask = shapeLayer;
遇到的坑:fillRule 有两个值 kCAFillRuleEvenOdd & kCAFillRuleNonZero
个人理解:
kCAFillRuleEvenOdd:是两个路径相交会消掉(偶消积不消)
kCAFillRuleNonZero:是两个路径相加
看图:
作为mask 就是相反的,效果图如下图
就介绍到这里了。。不对的地方,希望指正谢谢🙏。