使用iOS 8 SDK添加毛玻璃（Blur）效果

苹果在iOS 7中将界面改为扁平化，并大量使用了毛玻璃效果，下图所示为控制中心的毛玻璃效果。





但是iOS 7 SDK本身并未向开发者公开提供毛玻璃效果的API，因此开发者只能去自己实现毛玻璃效果或者找第三方类库解决。而现在，iOS 8 SDK中直接提供了UIBlurEffect类与UIVisualEffectView类，可以实现毛玻璃效果。这两个类的使用方法非常简单，步骤是：

1. 创建UIBlurEffect类的实例，并指定某一种毛玻璃效果。

2. 创建UIVisualEffectView类的实例，将步骤1中的UIBlurEffect类的实例应用到UIVisualEffectView类的实例上。

3. 将UIVisualEffectView类的实例置于待毛玻璃化的视图之上即可。

下面以一个简单的例子来演示，效果如下图所示。



首先创建一个新的项目，在项目中随便添加一个图片文件。在Main.storyboard中拖入一个UIImageView，设置其内容为刚加入的图片。为了实现毛玻璃效果，我们需要在此UIImageView的上方放置一个UIVisualEffectView。在Xcode的Object Library中找到Visual Effect View with Blur。



这里Visual Effect View with Blur就是一个UIVisualEffectView的实例，注意到UIVisualEffectView继承自UIView，因此它就是一个视图，可以直接拖拽到界面中。



所有位于UIVisualEffectView下方的视图，以及UIVisualEffectView的contentView中的视图会被毛玻璃化。

值得一提的是，如果位于下方的视图的内容是动态的，那么毛玻璃效果也会跟随动画发生变化。我们可以给上面的UIImageView添加动画：

override func viewWillAppear(animated: Bool) {
leadingCons.constant = 0
UIView.animateWithDuration(5.0, animations: { () -> Void in
self.leadingCons.constant = 200
self.imageView.layoutIfNeeded()
})
}

上面的代码会让UIImageView向右移动，运行后可以看到毛玻璃视图的内容也会跟随发生变化。

如果需要用代码实现毛玻璃效果，则代码为：

override func viewDidLoad() {
super.viewDidLoad()
let blurEffect = UIBlurEffect(style: .Light)
let blurView = UIVisualEffectView(effect: blurEffect)
view.addSubview(blurView)
}

其中UIBlurEffect构造方法中需要传入UIBlurEffectStyle枚举参数：

enum UIBlurEffectStyle : Int {
case ExtraLight
case Light
case Dark
}

项目代码：

点击打开链接

最后需要注意的是，UIBlurEffect类与UIVisualEffectView类只适用于iOS 8 SDK，因此如果你的app需要在iOS 7系统上运行的话，还需要另想办法哦。