Swift - 实现毛玻璃效果（Blur、模糊、虚化背景元素）

苹果从  iOS 7  起，大量使用了毛玻璃效果。比如上拉的控制中心就使用了毛玻璃效果。但当时还未向开发者公开提供毛玻璃效果的API，因此开发者只能去自己实现毛玻璃效果或者找第三方类库解决。
后来到了  iOS 8 ，SDK中直接提供了  UIBlurEffect  类与  UIVisualEffectView  类，配合使用这两个类可以轻松实现毛玻璃效果。

1，准备工作
假设我们在页面视图上放置了一个  imageView 。下面演示如何在其之上添加毛玻璃效果。

2，使用UIBlurEffect、UIVisualEffectView实现毛玻璃效果
（1）创建一个  UIBlurEffect  类的实例，并指定某一种毛玻璃效果样式。
（2）创建  UIVisualEffectView  类的实例，这个可以称它为模糊视图。将前面创建的  UIBlurEffect  类的实例应用到这个模糊视图上。
（3）将  UIVisualEffectView  类的实例（模糊视图）置于待毛玻璃化的视图之上即可。在其下方的所有视图都会有模糊效果。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

import  UIKit   class  ViewController :  UIViewController  {        override  func  viewDidLoad() {          super .viewDidLoad()                    //首先创建一个模糊效果          let  blurEffect =  UIBlurEffect (style: . Light )          //接着创建一个承载模糊效果的视图          let  blurView =  UIVisualEffectView (effect: blurEffect)          //设置模糊视图的大小（全屏）          blurView.frame.size =  CGSize (width: view.frame.width, height: view.frame.height)          //添加模糊视图到页面view上（模糊视图下方都会有模糊效果）          self .view.addSubview(blurView)      }        override  func  didReceiveMemoryWarning() {          super .didReceiveMemoryWarning()      } }

3，三种模糊效果
除了上面使用的  Light  样式。 UIBlurEffect  一共定义了三种效果，这些效果由枚举  UIBlurEffectStyle  来确定，

分别是： ExtraLight、 Light、 Dark。
我们可以根据色调（ hue）来确定特效视图与底部视图的混合样式，使其更符合我们的页面风格。
              

4，添加Vibrancy
通过模糊背景，我们可以让前景文字或其它视图元素显得更加突出。

而苹果在其之上又引入了  UIVibrancyEffect。 UIVibrancyEffect 主要用于放大和调整  UIVisualEffectView 视图下面的内容的颜色，同时让  UIVisualEffectView 的  contentView 中的内容看起来更加生动。
通常  UIVibrancyEffect 对象是与  UIBlurEffect 一起使用，下面对页面上的文本标签做  Vibrancy 效果，可以看到文本标签在屏幕上显得更为舒适。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35

import  UIKit   class  ViewController :  UIViewController  {        override  func  viewDidLoad() {          super .viewDidLoad()                    //首先创建一个模糊效果          let  blurEffect =  UIBlurEffect (style: . Light )          //接着创建一个承载模糊效果的视图          let  blurView =  UIVisualEffectView (effect: blurEffect)          //设置模糊视图的大小（全屏）          blurView.frame.size =  CGSize (width: view.frame.width, height: view.frame.height)                    //创建并添加vibrancy视图          let  vibrancyView =  UIVisualEffectView (effect:              UIVibrancyEffect (forBlurEffect: blurEffect))          vibrancyView.frame.size =  CGSize (width: view.frame.width, height: view.frame.height)          blurView.contentView.addSubview(vibrancyView)                    //将文本标签添加到vibrancy视图中          let  label= UILabel (frame: CGRectMake (10,20, 300, 100))          label.text =  "hangge.com"          label.font =  UIFont (name:  "HelveticaNeue-Bold" , size: 40)          label.textAlignment = . Center          label.textColor =  UIColor .whiteColor()          vibrancyView.contentView.addSubview(label)                    self .view.addSubview(blurView)      }        override  func  didReceiveMemoryWarning() {          super .didReceiveMemoryWarning()      } }

将  blurEffect 的样式设为  .Dark 的效果：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35

import  UIKit   class  ViewController :  UIViewController  {        override  func  viewDidLoad() {          super .viewDidLoad()                    //首先创建一个模糊效果          let  blurEffect =  UIBlurEffect (style: . Dark )          //接着创建一个承载模糊效果的视图          let  blurView =  UIVisualEffectView (effect: blurEffect)          //设置模糊视图的大小（全屏）          blurView.frame.size =  CGSize (width: view.frame.width, height: view.frame.height)                    //创建并添加vibrancy视图          let  vibrancyView =  UIVisualEffectView (effect:              UIVibrancyEffect (forBlurEffect: blurEffect))          vibrancyView.frame.size =  CGSize (width: view.frame.width, height: view.frame.height)          blurView.contentView.addSubview(vibrancyView)                    //将文本标签添加到vibrancy视图中          let  label= UILabel (frame: CGRectMake (10,20, 300, 100))          label.text =  "hangge.com"          label.font =  UIFont (name:  "HelveticaNeue-Bold" , size: 40)          label.textAlignment = . Center          label.textColor =  UIColor .whiteColor()          vibrancyView.contentView.addSubview(label)                    self .view.addSubview(blurView)      }        override  func  didReceiveMemoryWarning() {          super .didReceiveMemoryWarning()      } }

5，源码下载： hangge_1135.zip
原文出自： www.hangge.com   转载请保留原文链接： http://www.hangge.com/blog/cache/detail_1135.html