美文网首页IOS
UIVisualEffectView 模糊程度与颜色

UIVisualEffectView 模糊程度与颜色

作者: 冰霜海胆 | 来源:发表于2017-06-05 00:33 被阅读300次

从 iOS 8 开始提供 UIVisualEffectView 这种模糊效果的类,方便的同时也有些许局限性。

  • 例如:无法修改模糊的程度、无法修改颜色

1、先来看一下普通的效果:


2、实现模糊程度可控

模糊程度可控,是通过截停模糊效果的渲染而实现的。

import UIKit

open class BlurEffectView: UIVisualEffectView {
    
    /// 模糊等级 (0 ~ 1)
    open var blurLevel: Float = 1 {
        didSet {
            
            self.resumeAnimation()
            
            var blurEffect: UIVisualEffect
            if let effect = self.effect {
                blurEffect = effect
            } else {
                blurEffect = UIBlurEffect(style: .extraLight)
            }
            
            self.effect = nil
            
            UIView.animate(withDuration: TimeInterval(1 - blurLevel)) {
                self.effect = blurEffect
            }
            
            self.pauseAnimation(delay: 0.3)
        }
    }
    
}


extension UIView {
    
    /// 暂停动画
    fileprivate func pauseAnimation(delay: Double) {
    
        let time = delay + CFAbsoluteTimeGetCurrent()
        let timer = CFRunLoopTimerCreateWithHandler(kCFAllocatorDefault, time, 0, 0, 0, { timer in
            let layer = self.layer
            let pausedTime = layer.convertTime(CACurrentMediaTime(), from: nil)
            layer.speed = 0
            layer.timeOffset = pausedTime
        })
        
        CFRunLoopAddTimer(CFRunLoopGetCurrent(), timer, CFRunLoopMode.commonModes)
    }
    
    /// 继续动画
    fileprivate func resumeAnimation() {
        let pausedTime  = layer.timeOffset
        
        layer.speed = 1.0
        layer.timeOffset = 0
        layer.beginTime = layer.convertTime(CACurrentMediaTime(), from: nil) - pausedTime
    }
    
}

3、模糊颜色

毛玻璃模糊颜色是通过一个私有的 API 来实现的。

import UIKit

open class ColorfulBlurEffectView: UIVisualEffectView {

    fileprivate let blurEffect = (NSClassFromString("_UICustomBlurEffect") as! UIBlurEffect.Type).init()
    
    open var colorTint: UIColor? {
        get { return _value(forKey: "colorTint") as? UIColor }
        set { _setValue(newValue, forKey: "colorTint") }
    }
    
    /// 默认 0
    open var colorTintAlpha: CGFloat {
        get { return _value(forKey: "colorTintAlpha") as! CGFloat }
        set { _setValue(newValue, forKey: "colorTintAlpha") }
    }
    
    /// 默认 0
    open var blurRadius: CGFloat {
        get { return _value(forKey: "blurRadius") as! CGFloat }
        set { _setValue(newValue, forKey: "blurRadius") }
    }
    
    /// 默认 1.0
    open var scale: CGFloat {
        get { return _value(forKey: "scale") as! CGFloat }
        set { _setValue(newValue, forKey: "scale") }
    }
    
    
    public override init(effect: UIVisualEffect?) {
        super.init(effect: effect)
        
        prepare()
    }
    
    public required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        
        prepare()
    }
    
    fileprivate func prepare() {
        scale = 1
    }

}


extension ColorfulBlurEffectView {
    
    fileprivate func _value(forKey key: String) -> Any? {
        return blurEffect.value(forKeyPath: key)
    }
    
    fileprivate func _setValue(_ value: Any?, forKey key: String) {
        blurEffect.setValue(value, forKeyPath: key)
        self.effect = blurEffect
    }
    
}

使用

colorEffectView.colorTint = #colorLiteral(red: 1, green: 0.1857388616, blue: 0.5733950138, alpha: 1)
colorEffectView.colorTintAlpha = 0.5
colorEffectView.blurRadius = 20

相关文章

网友评论

    本文标题:UIVisualEffectView 模糊程度与颜色

    本文链接:https://www.haomeiwen.com/subject/gnibfxtx.html