你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發基礎 >> 使用UIVisualEffectView為視圖添加特殊效果

使用UIVisualEffectView為視圖添加特殊效果

編輯:IOS開發基礎

1.jpg

在iOS 8後,蘋果開放了不少創建特效的接口,其中就包括創建毛玻璃(blur)的接口。

通常要想創建一個特殊效果(如blur效果),可以創建一個UIVisualEffectView視圖對象,這個對象提供了一種簡單的方式來實現復雜的視覺效果。這個可以把這個對象看作是效果的一個容器,實際的效果會影響到該視圖對象底下的內容,或者是添加到該視圖對象的contentView中的內容。

我們舉個例子來看看如果使用UIVisualEffectView:

let bgView: UIImageView = UIImageView(image: UIImage(named: "visual"))
bgView.frame = self.view.bounds
self.view.addSubview(bgView)
let blurEffect: UIBlurEffect = UIBlurEffect(style: .Light)
let blurView: UIVisualEffectView = UIVisualEffectView(effect: blurEffect)
blurView.frame = CGRectMake(50.0, 50.0, self.view.frame.width - 100.0, 200.0)
self.view.addSubview(blurView)

這段代碼是在當前視圖控制器上添加了一個UIImageView作為背景圖。然後在視圖的一小部分中使用了blur效果。

我們可以看到UIVisualEffectView還是非常簡單的。需要注意是的,不應該直接添加子視圖到UIVisualEffectView視圖中,而是應該添加到UIVisualEffectView對象的contentView中。

另外,盡量避免將UIVisualEffectView對象的alpha值設置為小於1.0的值,因為創建半透明的視圖會導致系統在離屏渲染時去對UIVisualEffectView對象及所有的相關的子視圖做混合操作。這不但消耗CPU/GPU,也可能會導致許多效果顯示不正確或者根本不顯示。

我們在上面看到,初始化一個UIVisualEffectView對象的方法是UIVisualEffectView(effect: blurEffect),其定義如下:

init(effect effect: UIVisualEffect)

這個方法的參數是一個UIVisualEffect對象。我們查看官方文檔,可以看到在UIKit中,定義了幾個專門用來創建視覺特效的,它們分別是UIVisualEffect、UIBlurEffect和UIVibrancyEffect。它們的繼承層次如下所示:

NSObject
| -- UIVisualEffect
    | -- UIBlurEffect
    | -- UIVibrancyEffect

UIVisualEffect是一個繼承自NSObject的創建視覺效果的基類,然而這個類除了繼承自NSObject的屬性和方法外,沒有提供任何新的屬性和方法。其主要目的是用於初始化UIVisualEffectView,在這個初始化方法中可以傳入UIBlurEffect或者UIVibrancyEffect對象。

一個UIBlurEffect對象用於將blur(毛玻璃)效果應用於UIVisualEffectView視圖下面的內容。如上面的示例所示。不過,這個對象的效果並不影響UIVisualEffectView對象的contentView中的內容。

UIBlurEffect主要定義了三種效果,這些效果由枚舉UIBlurEffectStyle來確定,該枚舉的定義如下:

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

其主要是根據色調(hue)來確定特效視圖與底部視圖的混合。

與UIBlurEffect不同的是,UIVibrancyEffect主要用於放大和調整UIVisualEffectView視圖下面的內容的顏色,同時讓UIVisualEffectView的contentView中的內容看起來更加生動。通常UIVibrancyEffect對象是與UIBlurEffect一起使用,主要用於處理在UIBlurEffect特效上的一些顯示效果。接上面的代碼,我們看看在blur的視圖上添加一些新的特效,如下代碼所示:

let vibrancyView: UIVisualEffectView = UIVisualEffectView(effect: UIVibrancyEffect(forBlurEffect: blurEffect))
vibrancyView.setTranslatesAutoresizingMaskIntoConstraints(false)
blurView.contentView.addSubview(vibrancyView)
var label: UILabel = UILabel()
label.setTranslatesAutoresizingMaskIntoConstraints(false)
label.text = "Vibrancy Effect"
label.font = UIFont(name: "HelveticaNeue-Bold", size: 30)
label.textAlignment = .Center
label.textColor = UIColor.whiteColor()
vibrancyView.contentView.addSubview(label)

vibrancy特效是取決於顏色值的。所有添加到contentView的子視圖都必須實現tintColorDidChange方法並更新自己。需要注意的是,我們使用UIVibrancyEffect(forBlurEffect:)方法創建UIVibrancyEffect時,參數blurEffect必須是我們想加效果的那個blurEffect,否則可能不是我們想要的效果。

另外,UIVibrancyEffect還提供了一個類方法notificationCenterVibrancyEffect,其聲明如下:

class func notificationCenterVibrancyEffect() -> UIVibrancyEffect!

這個方法創建一個用於通知中心的Today擴展的vibrancy特效。

參考

  1. UIVisualEffectView Class Reference

  2. UIVisualEffect Class Reference

  3. UIBlurEffect Class Reference

  4. UIVibrancyEffect Class Reference

  5. UIVisualEffect – Swift Tutorial

  6. iOS 8: UIVisualEffect

  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved