css毛玻璃效果白边_【iOS】 一个模糊(毛玻璃)效果引发的探索

剧情介绍

在iOS开发中，经常会看到毛玻璃效果，也叫模糊效果，比如系统的通知中心，这个很时髦的效果增加了美观性。

通知中心的模糊效果

查看资料发现实现毛玻璃效果有很多种方式，下面总结了其中几种方式。

静态模糊效果

对于静态的模糊效果，最直接的方式就是加载做好的模糊图片

动态模糊效果

苹果原生控件:UIVisualEffectView

苹果原生API:Core Image 的滤镜效果

苹果原生API:vImage

使用第三方工具GPUImage

使用第三方工具FXBlurView

...

一、苹果原生控件:UIVisualEffectView实现模糊效果

UIVisualEffectView是iOS8的新特性，该控件主要用于为原有的控件增加模糊效果。

由于是iOS8的新特性，所以具有一定的局限性。

UIVisualEffectView继承自UIView，没有继承UIControl，所以只能做静态控件使用。

控制UIVisualEffectView控件模糊效果的属性时effect只读属性，该属性的类型是UIVisualEffect,该类型有两个子类：UIBlurEffect和UIVibrancyEffect。

UIBlurEffect允许应用程序中动态的创建实时的模糊效果；UIVibrancyEffect允许在模糊效果上“写字”。

Blur Style有三种效果：

UIBlurEffectStyleLight：白色的模糊效果。

UIBlurEffectStyleExtraLight：极亮的白色模糊效果。

UIBlurEffectStyleDark:暗色的模糊效果。

可以通过在Interface Bulider中将UIVibrancyEffect控件直接拖入某个控件内添加模糊效果，也可以通过纯代码的形式创建和添加。

// UIBlurEffectStyleLight模式

UIVisualEffectView *lightView = [[UIVisualEffectView alloc] initWithEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight]];

lightView.frame = CGRectMake(40, 40, 300, 100);

[self.imageView addSubview:lightView];

// UIBlurEffectStyleExtraLight模式

UIVisualEffectView *extraLightView = [[UIVisualEffectView alloc] initWithEffect:[UIBlurEffect effectWithStyle:UIBlurEffectStyleExtraLight]];

extraLightView.frame = CGRectMake(40, 160, 300, 100);

[self.imageView addSubview:extraLightView];

// UIBlurEffectStyleD