有時候我們可能需要再界面上重點提示某些地方,例如鏤空的提示效果钟些,這個時候界面上遮蓋蒙板但需要突出的地方需要鏤空展示橡娄,這個時候我們需要用到蒙板功能立美,給layer的mask層一個新CAShapeLayer,并使用UIBezierPath繪制我們想要的圖形隘竭,將繪制的圖形設(shè)置給CAShapeLayer的path塘秦,來實現(xiàn)改變layer形狀的效果。
image.png
上面鏤空部分的源碼:
//底部灰色的view
UIView *maskView = [[UIView alloc] initWithFrame:self.bounds];
maskView.backgroundColor = LS_COLORS_NEW_BLACK;
maskView.alpha = 0.7;
[self addSubview:maskView];
//貝塞爾曲線 畫一個矩形
UIBezierPath *bpath = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:0];
//矩形鏤空的部分
CGRect ovalRect = CGRectMake(kSCREEN_WIDTH/3 - 10, (76 * WIDTH_RATIO)+64, kSCREEN_WIDTH/3+20, 70);
UIBezierPath *ovalPath = [[UIBezierPath bezierPathWithOvalInRect:ovalRect] bezierPathByReversingPath];
[bpath appendPath:ovalPath];
//橢圓
UIBezierPath *squarePath = [[UIBezierPath bezierPathWithRoundedRect:CGRectMake(kSCREEN_WIDTH - 100, 64, 100, 40) cornerRadius:2.0]bezierPathByReversingPath];
[bpath appendPath:squarePath];
//創(chuàng)建一個CAShapeLayer 圖層
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
shapeLayer.path = bpath.CGPath;
//添加圖層蒙板
maskView.layer.mask = shapeLayer;
首先繪制了一個與背景同等大小的UIBezierPath路徑
UIBezierPath *bpath = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:0];
然后繪制另外一個路徑动看,即右上角正方形尊剔,其中bezierPathByReversingPath是反轉(zhuǎn)內(nèi)容的當(dāng)前路徑曲線路徑的對象,將這個反轉(zhuǎn)后的路徑添加到上面繪制的路徑中菱皆,即能將這部分的鏤空出來
CGRect ovalRect = CGRectMake(kSCREEN_WIDTH/3 - 10, (76 * WIDTH_RATIO)+64, kSCREEN_WIDTH/3+20, 70);
UIBezierPath *ovalPath = [[UIBezierPath bezierPathWithOvalInRect:ovalRect] bezierPathByReversingPath];
[bpath appendPath:ovalPath];