美文网首页iOS开发技术iOS开发IOS特技
iOS App中添加半透明新手指引

iOS App中添加半透明新手指引

作者: 黑黑的小土豆 | 来源:发表于2016-01-12 18:03 被阅读12647次

    先看效果图

    这个是矩形 这个是矩形 这个是圆形 这个是圆形

    基本思路就是在一个View 上加上蒙版 msak 。不贴代码的都是流氓,So ,代码如下:

    #pragma mark - ===== 新手指引 =====
    
    /**
     *  新手指引
     */
     
    - (void)newUserGuide
    {
    
        // 这里创建指引在这个视图在window上
        CGRect frame = [UIScreen mainScreen].bounds;
        UIView * bgView = [[[UIView alloc]initWithFrame:frame]autorelease];
        bgView.backgroundColor = HEX_RGBA(0x323232, 0.8);
        UITapGestureRecognizer * tap = [[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(sureTapClick:)]autorelease];
        [bgView addGestureRecognizer:tap];
        [[UIApplication sharedApplication].keyWindow addSubview:bgView];
        
        //create path 重点来了(**这里需要添加第一个路径)
        UIBezierPath *path = [UIBezierPath bezierPathWithRect:frame];   
        // 这里添加第二个路径 (这个是圆)
        [path appendPath:[UIBezierPath bezierPathWithArcCenter:CGPointMake(frame.size.width - 30, 42) radius:30 startAngle:0 endAngle:2*M_PI clockwise:NO]]; 
        // 这里添加第二个路径 (这个是矩形)
        //[path appendPath:[[UIBezierPath bezierPathWithRoundedRect:CGRectMake(frame.size.width/2.0-1, 234, frame.size.width/2.0+1, 55) cornerRadius:5] bezierPathByReversingPath]];
        
        CAShapeLayer *shapeLayer = [CAShapeLayer layer];
        shapeLayer.path = path.CGPath;
        //shapeLayer.strokeColor = [UIColor blueColor].CGColor;
        [bgView.layer setMask:shapeLayer];  
        UIImageView * imageView = [[[UIImageView alloc]initWithFrame:CGRectMake(frame.size.width -300,72,270, 137)]autorelease];
        imageView.image = [UIImage imageNamed:@"CouponBoard_guid"];
        [bgView addSubview:imageView];
        
    } 
    
    
    /**
     *   新手指引确定
     */
    - (void)sureTapClick:(UITapGestureRecognizer *)tap
    {
        UIView * view = tap.view;
        [view removeFromSuperview];
        [view removeAllSubviews];
        [view removeGestureRecognizer:tap];
        [[NSUserDefaults standardUserDefaults] setBool:YES forKey:@"firstCouponBoard_iPhone"];
    }
    
    

    其他方法自行google 这里推荐一个博文 提供不同思路。

    相关文章

      网友评论

      • 心语风尚:如果要求那个透明圆的边缘的渐变到透明呢
      • minjing_lin:新思路
      • 崠崠:作者 为什么圆形不用bezierPathByReversingPath 而矩形需要呢?
      • Mingor丶:您好,我请教楼楼一个问题。
        在appendPath方法中能否添加自定义路径(用UIBezierPath画的不规则图形)呢?
        我自己尝试了下,貌似不行...:joy:
        黑黑的小土豆:@Mingor丶 :sunglasses: :sunglasses:
        Mingor丶::flushed: 刚刚搞成功了,感谢楼主
      • 7emini:学习了:+1:
      • 5d0d295a6050:请教为什么不加bezierPathByReversingPath矩形画不出,clockwise设置为yes也画不出
        5d0d295a6050:@黑黑的小土豆 感谢回复,看了你的解答有一点概念,但是还有点疑惑:
        frame+rect(Reverse)的路径如果是你所说的效果,那我理解frame+rect应该是rect部分绘制,其他剩余部分镂空了
        黑黑的小土豆:bezierPathByReversingPath 的意思就是反转 就是将你设置的路径以外的部分加入到路径中这样 你设置的路径就不在绘制的范围之内。在setMaskLayer的时候 你设置的那部分路径就没有了 就成了镂空的。 clockwise 这个值得意思也是这样。
      • Turingapple:求一个完整demo
        :sparkles:
        黑黑的小土豆:你把这个代码复制过去 基本就能运行了
      • SRefuse:新人 怎么弄呀 , 就是弄不了呀
        黑黑的小土豆:有什么问题么 可以描述下么?
      • 静心_安神:我想问,你上面有5个界面, 是写在一个控制器里面的吗?
        黑黑的小土豆:@静心_安神 第一次进入某个界面 就走哪一个
        静心_安神:你这五个界面是要用户进入第一个界面的时候都要走一遍, 还是用户第一次进入某个界面才弹出蒙层!
        黑黑的小土豆:@静心_安神 五个界面是不同的 在不同的控制器里面 五张图只是展示这个可以做到什么效果
      • 巴图鲁:厉害
        黑黑的小土豆:@巴图鲁 一起学习 哈哈 不厉害
      • 李乾坤David:楼主,github上有Demo吗?
        6960c5e09fce:能有个demo吗?
        微光星芒:我想这个蒙版的边框颜色是白色的,请问该怎么设置?
        黑黑的小土豆:@李乾坤David 这个比较简单 没放demo
      • 018dfaa47080:如果在同一个controller下指示2个或多个button 怎么做?
        崠崠:@黑黑的小土豆 替换的frame指的是?
        018dfaa47080:@黑黑的小土豆 谢谢!
        黑黑的小土豆:@梦女孩的蒙娜丽莎 计算出两个button的frame /[path appendPath:[[UIBezierPath bezierPathWithRoundedRect:CGRectMake(frame.size.width/2.0-1, 234, frame.size.width/2.0+1, 55) cornerRadius:5] bezierPathByReversingPath]];
        多调用这句 把frame替换就可以了
      • 770b47020330:楼主,你那个箭头使用画图做的吗?
        黑黑的小土豆:@杨小默l 这个箭头和文字是UI给的一张背景透明的图片
      • Money_Ai:appendpath后,把path设为mask,那么被append的那一块就不会成为mask的一部分对吗?
        黑黑的小土豆:@Money_Ai 对的 不过在appendPath 的时候需要注意最后一个参数
      • 6016109a7f0d:一个页面要多个形状要透明怎么破 大神
        黑黑的小土豆:@6016109a7f0d 就在添加矩形 哪里在添加几个形状 注意自己填加的形状的frame 值就OK
      • 洛丹伦的夏天:HEX_RGBA(0x323232, 0.8) 老师,这个是什么颜色来的
        黑黑的小土豆:@洛丹伦的夏天 这是一个宏定义 就是一个简单的颜色 那个背景的灰色 透明度为0.8
        #pragma mark - === UIColor定义的宏 ===

        #undef RGB
        #define RGB(R,G,B) [UIColor colorWithRed:R/255.0f green:G/255.0f blue:B/255.0f alpha:1.0f]

        #undef RGBA
        #define RGBA(R,G,B,A) [UIColor colorWithRed:R/255.0f green:G/255.0f blue:B/255.0f alpha:A]

        #undef HEX_RGB
        #define HEX_RGB(V) [UIColor fromHexValue:V]

        #undef HEX_RGBA
        #define HEX_RGBA(V, A) [UIColor fromHexValue:V alpha:A]

        #undef SHORT_RGB
        #define SHORT_RGB(V) [UIColor fromShortHexValue:V]
      • 00715f4b0537:学习了 :smile: :smile:
      • 溪枫狼:一直没发现,还可以添加path,学习了
      • 溪枫狼:已收
      • Raybon_lee:不错大师造的轮子:smile:
      • levishi:ios菜鸟,受教
        黑黑的小土豆:@levishi 我也是菜鸟,共同学习:beers:
      • for_in:MRC?老项目?e足道,这公司我投过简历
        黑黑的小土豆:@GitHub搬运工 已经和leader提了,项目应该重构了。
        for_in:@黑黑的小土豆 趁项目还没那么大,改ARC吧,不然没法维护,已经和时代脱节了
        黑黑的小土豆:@GitHub搬运工 被发现了…来了之后才知道是MRC
      • 言氓:e足道是啥?
        驿路梨花处处开:你这个跟那个熊狸家和河狸家是一样的吧?他们都做的还挺大的,可以相互解签。
        黑黑的小土豆:@建骥寒梅 e足道是一个提供上门足疗推拿的健康互联网平台,他们家的技师手法挺好的,华南首家提供上门足浴,还有国家三甲中医院提供的健康产品。可以关注e足道微信公众号或者下载e足道app体验。

      本文标题:iOS App中添加半透明新手指引

      本文链接:https://www.haomeiwen.com/subject/umkckttx.html