這種遮罩一般做爲新手引導頁面。一般有鏤空的一部分,附有描述,指引用戶第一次進入界面該如何操做,只顯示一次。app
優勢:程序實現簡單,便捷。 缺點:適配不一樣機型須要多套圖片(Android心裏是崩潰的),後期迭代界面改動則要更新圖片,UI工做量龐大。
優勢:UI只提供描述的圖片便可,減小應用大小,靈活適配不一樣機型。 缺點:代碼較第一種略多,後期迭代界面改動要更新控件frame。
核心代碼:iview
- (void)creatControlWithType:(HKGuidePageType)type completion:(FinishBlock)completion { _finish = completion; // 遮蓋視圖 CGRect frame = [UIScreen mainScreen].bounds; UIView *bgView = [[UIView alloc] initWithFrame:frame]; bgView.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.7f]; [bgView addGestureRecognizer:[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tap:)]]; [[UIApplication sharedApplication].keyWindow addSubview:bgView]; // 信息提示視圖 UIImageView *imgView = [[UIImageView alloc] init]; [bgView addSubview:imgView]; // 第一個路徑 UIBezierPath *path = [UIBezierPath bezierPathWithRect:frame]; switch (type) { case HKGuidePageTypeHome: // 下一個路徑,圓形 [path appendPath:[UIBezierPath bezierPathWithArcCenter:KSuitPoint(227, 188) radius:KSuitFloat(46) startAngle:0 endAngle:2 * M_PI clockwise:NO]]; imgView.frame = KSuitRect(220, 40, 100, 100); imgView.image = [UIImage imageNamed:@"hi"]; _guidePageKey = HKGuidePageHomeKey; break; case HKGuidePageTypeMajor: // 下一個路徑,矩形 [path appendPath:[[UIBezierPath bezierPathWithRoundedRect:KSuitRect(5, 436, 90, 40) cornerRadius:5] bezierPathByReversingPath]]; imgView.frame = KSuitRect(100, 320, 120, 120); imgView.image = [UIImage imageNamed:@"ly"]; _guidePageKey = HKGuidePageMajorKey; break; default: break; } // 繪製透明區域 CAShapeLayer *shapeLayer = [CAShapeLayer layer]; shapeLayer.path = path.CGPath; [bgView.layer setMask:shapeLayer]; }