Skip to content

APP进入后台显示毛玻璃

CoderYoung edited this page Sep 15, 2015 · 1 revision

2015-08-15

相信很多人用过支付宝,当它进入后台,然后双击home键,在后台显示的View有一层毛玻璃效果的蒙版, 这是为了保护隐私不让别人看到账户里面的敏感信息,在这我就模仿做了个效果。

##利用第三方库 这里使用的是FXBlurView,使用起来非常简单

// 引入头文件
#import "FXBlurView.h"

###蒙版 添加移除 分别是在APP 进入后台回到前台 进行的操作,所以要在AppDelegate.m文件中添加方法

/**
 *  APP进入后台
 *
 */
- (void)applicationDidEnterBackground:(UIApplication *)application {
    
    // 当进入后台,添加毛玻璃遮挡
    [self addBlurEffectWithFXBlurView];
}

/**
 *  APP将进入前台
 *
 */
- (void)applicationWillEnterForeground:(UIApplication *)application {

    // 进入前台移除毛玻璃
    [self removeBlurEffectWithFXBlurView];
}

###懒加载方式加载FXBlurView

@property (nonatomic, strong) FXBlurView *blurView;/**< 毛玻璃View */

- (FXBlurView *)blurView {
    if (!_blurView) {
        _blurView = [[FXBlurView alloc] initWithFrame:[UIScreen mainScreen].bounds];
        _blurView.blurRadius = 40;// 模糊度
    }
    return _blurView;
}

###添加,移除方法

/**
 *  创建毛玻璃效果View,通过第三方库FXBlurView
 */
-(void)addBlurEffectWithFXBlurView {
    [[[UIApplication sharedApplication] keyWindow] addSubview:self.blurView];
}

/**
 *  移除毛玻璃效果View,配合addBlurEffectWithFXBlurView使用
 */
-(void) removeBlurEffectWithFXBlurView {
    [UIView animateWithDuration:0.5 animations:^{
        [self.blurView removeFromSuperview];
    }];
}

###效果图 FXBlurView

##利用iOS8推出的UIVisualEffectView UIVisualEffectView是iOS8之后推出的API,可以用来制作毛玻璃效果

###懒加载方式加载UIVisualEffectView

@property (nonatomic, strong) UIVisualEffectView *effectView;/**< 系统自带的毛玻璃View */

- (UIVisualEffectView *)effectView {
    if (!_effectView) {
        // 毛玻璃view 视图
        _effectView = [[UIVisualEffectView alloc] initWithEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]];
        // 设置模糊透明度
        _effectView.alpha = 1.f;
        _effectView.frame = JHScreenBounds;
    }
    
    return _effectView;
}

###添加,移除方法

/**
 *  创建毛玻璃效果View,系统自带的API,iOS8之后可用
 */
-(void) addBlurEffectWithUIVisualEffectView {
    [[[UIApplication sharedApplication] keyWindow] addSubview:self.effectView];
}

/**
 *  移除毛玻璃效果View,配合addBlurEffectWithUIBlurEffect使用
 */
-(void) removeBlurEffectWithUIVisualEffectView {
    [UIView animateWithDuration:0.5 animations:^{
        [self.effectView removeFromSuperview];
    }];
}

###效果图 UIVisualEffectView

Clone this wiki locally