IOS 开发引导遮罩

项目需要引导图,简单介绍实现记录一下

问题:IOS自定义如何添加引导遮罩?

解决:思路为当前需要显示遮罩的View,添加一层半透明遮罩类似于蒙版(PS中常用),在需要引导的控件上,勾勒出镂空效果,并在上,下,左右不分根据自己需要,显示文字效果。

注意:如需添加图片效果,了解大体思路应该不难。


-(void)showGuidView{
 NSUserDefaults *defaults = [NSUserDefaults standardUserDefaults];
   if(![[defaults objectForKey:@"showGuidViewStatues"] isEqualToString:@"1"]){
    [self setGuidViewTextView:self.directionGradleView andContent:@"xxxxx,点击屏幕下一项" andTag:1001 andOffsetUp:YES];
   }
}

-(void)setGuidViewTextView:(UIView*)attachView andContent:(NSString*)content andTag:(int)tag andOffsetUp:(BOOL) upOffset{
//创建需要显示遮罩空间路径
     UIBezierPath *tempPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(attachView.frame.origin.x, attachView.frame.origin.y, attachView.bounds.size.width, attachView.bounds.size.height) byRoundingCorners:(UIRectCornerTopLeft |UIRectCornerTopRight |UIRectCornerBottomRight|UIRectCornerBottomLeft) cornerRadii:CGSizeMake(4, 4)];

//获取手机屏幕大小并填充背景颜色,半透明
      UIView *guideView = [[UIView alloc] initWithFrame:[UIScreen mainScreen].bounds];
      guideView.backgroundColor = [UIColor blackColor];
      guideView.alpha = 0.6;
      guideView.layer.mask = [self addTransparencyViewWith:tempPath];
   //用来区分每个引导标签,后续删除使用
      guideView.tag =tag;
 
//控件文字显示
     UITextView *textView = nil;
     // 文字内容
     if(upOffset){
      if(tag == 1002){
        textView = [[UITextView alloc] initWithFrame:CGRectMake(attachView.frame.origin.x-attachView.bounds.size.width, attachView.frame.origin.y-50, guideView.bounds.size.width, attachView.bounds.size.height)];
      }else{
        textView = [[UITextView alloc] initWithFrame:CGRectMake(attachView.frame.origin.x, attachView.frame.origin.y-50, guideView.bounds.size.width, attachView.bounds.size.height)];
      }

     }else{
      textView = [[UITextView alloc] initWithFrame:CGRectMake(attachView.frame.origin.x, attachView.frame.origin.y+50, guideView.bounds.size.width/2, attachView.bounds.size.height*2)];
     }

     textView.backgroundColor = UIColor.clearColor;
     textView.selectable = NO;
     textView.font =[UIFont fontWithName:@"System" size:16];
     textView.font = [UIFont boldSystemFontOfSize:16];
     textView.textColor = UIColor.whiteColor;
     textView.text = content;
     [guideView addSubview:textView];
     //显示引导页面
     [[UIApplication sharedApplication].keyWindow addSubview:guideView];
     //为引导页面添加点击事件,方便更换下一个
     UITapGestureRecognizer * tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(GuiViewEvent:)];
     //设置需要连续点击几次才响应,默认点击1次
      [tapGesture setNumberOfTapsRequired:1];
     [guideView addGestureRecognizer:tapGesture];
}

/**
  引导页面点击事件
 */
-(void)GuiViewEvent:(UITapGestureRecognizer *)gesture
{
//根据自定TAG 检查并删除上一个引导页面
 if([[UIApplication sharedApplication].keyWindow viewWithTag:1001] != nil){
  //处理事件
  [[[UIApplication sharedApplication].keyWindow viewWithTag:1001]removeFromSuperview];
  NSString* guidNextStr =@"xxxxxxx,点击屏幕下一项";
  [self setGuidViewTextView:self.throttleGradleView andContent:guidNextStr andTag:1002 andOffsetUp:YES];

 }else if([[UIApplication sharedApplication].keyWindow viewWithTag:1002] != nil){
  //处理事件
  [[[UIApplication sharedApplication].keyWindow viewWithTag:1002]removeFromSuperview];
  NSString* guidNextStr=@"xxxxxxx点击屏幕下一项";
  [self setGuidViewTextView:self.settingBtn andContent: guidNextStr andTag:1003 andOffsetUp:NO];

 }else if([[UIApplication sharedApplication].keyWindow viewWithTag:1003] != nil){
  //处理事件
  [[[UIApplication sharedApplication].keyWindow viewWithTag:1003]removeFromSuperview];
  NSString* guidNextStr=@"xxxxxxxxx,点击屏幕开始游戏";
  [self setGuidViewTextView:self.onHawkeyeBtn andContent: guidNextStr andTag:1004 andOffsetUp:NO];

 }else if([[UIApplication sharedApplication].keyWindow viewWithTag:1004] != nil){
  [[[UIApplication sharedApplication].keyWindow viewWithTag:1004]removeFromSuperview];
  NSUserDefaults *defaults = [NSUserDefaults standardUserDefaults];
  [defaults setValue:@"1" forKey:@"showGuidViewStatues"];
  [defaults synchronize];
 }


 }
//返回引导依附View区域
- (CAShapeLayer *)addTransparencyViewWith:(UIBezierPath *)tempPath{
    UIBezierPath *path = [UIBezierPath bezierPathWithRect:[UIScreen mainScreen].bounds];
    [path appendPath:tempPath];
    path.usesEvenOddFillRule = YES;
 
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    shapeLayer.path = path.CGPath;
//    shapeLayer.fillColor= [UIColor blackColor].CGColor;  //其他颜色都可以,只要不是透明的
//    shapeLayer.fillColor =[UIColor clearColor].CGColor;
    shapeLayer.fillRule=kCAFillRuleEvenOdd;
    return shapeLayer;
}

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Unity新手引导遮罩是一种常见的界面设计元素,用于引导新手玩家了解游戏界面和操作。它通常被用于高亮显示特定的界面元素,并给予玩家相应的提示。 Unity中提供了一些内置的方法来创建新手引导遮罩。首先,开发人员可以使用UGUI(Unity的用户界面系统)来创建游戏界面,之后可以添加一张透明的图片作为新手引导遮罩层。然后,可以使用Unity的2D或3D特效来绘制遮罩层所遮挡住的界面元素。这些特效可以使被遮挡的区域变得模糊或是使其颜色变暗,以突出要引导的界面元素。 在引导过程中,可以根据玩家操作的进度来动态地更新遮罩层的位置和形状。例如,当玩家点击一个按钮时,可以使遮罩层逐渐展开,直到完全显示该按钮为止。还可以使用动画效果来增强引导的效果,如淡入淡出或平滑移动的效果。 同时,为了提供更多的交互性,可以为遮罩层添加响应玩家操作的功能。比如,在遮罩层上添加一个按钮,当玩家点击该按钮时,遮罩层可以自动更新到下一个引导步骤,或者直接跳转至其他相关的功能界面。 总之,Unity的新手引导遮罩是一个非常实用的功能,可以帮助开发人员创建出更具吸引力和易于理解的游戏体验。它不仅可以引导玩家了解游戏的操作流程,还可以提供更好的用户体验,使玩家更容易上手游戏。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值