【iOS】中間透明的引導蒙層
阿新 • • 發佈:2018-11-01
需求
如圖口袋蜜蜂app一鍵海報的新手指引圖,需求是遮罩層中間透明的,把底層的第一張海報顯示出來,如圖:
實現
通過UIBezierPath和CAShapeLayer繪製一張中間為透明的黑色半透明遮罩層。
步奏1、新建類PCOnePosterGuide繼承自UIView
步奏2、重寫drawRect:方法:
- (void)drawRect:(CGRect)rect {
[super drawRect:rect];
//整個view(如下圖,藍色部分)
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:rect cornerRadius:0 ];
//中間空的部分(如下圖:粉紅色部分)
UIBezierPath *maskPath;
CGFloat maskW = (IOS_VERSION>=10.)?64.:50.;
CGFloat padding = (SCREEN_WIDTH>375)?6.:2.;
maskPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(SCREEN_WIDTH-maskW-padding, PCSTATUSBAR_HEIGHT+4, maskW, 36.)
byRoundingCorners:UIRectCornerAllCorners
cornerRadii:CGSizeMake(2 , 2)];
[path appendPath:maskPath];
//使用奇偶性原則,設定填充部分為除去粉色的藍色部分
[path setUsesEvenOddFillRule:YES];
CAShapeLayer *fillLayer = [CAShapeLayer layer];
fillLayer.path = path.CGPath;
fillLayer.fillRule = kCAFillRuleEvenOdd;
fillLayer.fillColor = [UIColor blackColor].CGColor;
fillLayer.opacity = 0.5;
[self.layer addSublayer:fillLayer];
}