zoukankan      html  css  js  c++  java
  • iOS-毛玻璃、navigationBar滑动颜色渐变

    1、毛玻璃实现

    iOS8以上,官方提供了系统方法实现毛玻璃,代码如下:

    // iOS8 UIVisualEffectView
        UIImageView *bgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"car.png"]];
        bgView.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
        [self.view addSubview:bgView];
        UIVisualEffectView *blurView = [[UIVisualEffectView alloc] initWithEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]];
        blurView.alpha = 0.9; // 控制模糊程度
        blurView.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
        [bgView addSubview:blurView];
        
        UIVibrancyEffect *vibrancyView = [UIVibrancyEffect effectForBlurEffect:(UIBlurEffect *)blurView.effect];
        UIVisualEffectView *visualEffectView = [[UIVisualEffectView alloc] initWithEffect:vibrancyView];
        visualEffectView.translatesAutoresizingMaskIntoConstraints = NO;
        [blurView.contentView addSubview:visualEffectView];
    

    a> UIBlurEffectStyle = UIBlurEffectStyleExtraLight;

     
    Paste_Image.png

    b> UIBlurEffectStyle = UIBlurEffectStyleLight;

     
    Paste_Image.png

    c> UIBlurEffectStyle = UIBlurEffectStyleDark;

     
    Paste_Image.png
    2、导航栏滑动渐变

    导航栏最开始的状态是透明的状态,可以看到后面的图片。之后随着用户的滑动颜色开始加深。
    代码如下:

    - (void)viewWillAppear:(BOOL)animated {
        [super viewWillAppear:animated];
        [self.navigationController.navigationBar setBackgroundImage:[UIImage new]
                                                      forBarMetrics:UIBarMetricsDefault];
         self.navigationController.navigationBar.shadowImage = [UIImage new];
    }
    

    在tableview或scrollview的代理方法中:

    - (void)scrollViewDidScroll:(UIScrollView *)scrollView {
        CGFloat minAlphaOffset_Y = - 64;
        CGFloat maxAlphaOffset_Y = 125;
        CGFloat offset_Y = scrollView.contentOffset.y;
        CGFloat alpha = (offset_Y - minAlphaOffset_Y) / (maxAlphaOffset_Y - minAlphaOffset_Y);
        [[[self.navigationController.navigationBar subviews] objectAtIndex:0] setAlpha:alpha];
    }
    

    但是在跳转的时候需要恢复原状,即导航栏呈现不透明状态,可以封装跳转方法:

    - (void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated{
        [[[self.navigationController.navigationBar subviews] objectAtIndex:0] setAlpha:1];
        [self.navigationController pushViewController:viewController animated:animated];
    }
    

     

  • 相关阅读:
    (项目)在线教育平台(九)
    (项目)在线教育平台(八)
    界面渐变特效 -- CSS实现 -- 兼容IE8
    固定背景图片铺满浏览器窗口
    时间连带上下午
    慢显示动画
    CSS强制英文、中文换行与不换行 强制英文换行
    html5 标签在 IE 下使用
    html5 兼容版本 video
    添加到收藏夹
  • 原文地址:https://www.cnblogs.com/shenlaiyaoshi/p/8807182.html
Copyright © 2011-2022 走看看