CODEWITHSUNDEEP
iosswiftuivisualeffectviewuiblureffect
Sagaya Abdul
Sagaya Abdul

Reputation: 161

How to reduce blur effect on UIVisualEffectView

How can i reduce the blur effect on a UIVisualEffectView it gives me options of light, extraLight and dark which are not good enough for me i am trying to achieve something like this enter image description here

Upvotes: 3

Views: 3051

Answers (4)

John Scalo
John Scalo

Reputation: 3421

Here's my riff on bodich's answer that fixes the problem of the blur resetting each time the app comes to the foreground. I'm still not convinced this hack is shippable since there may be other times that CoreAnimation decides to finish stale animations in which case the blur would suddenly become full intensity.

class BlurEffectView: UIVisualEffectView {
    
    private var animator = UIViewPropertyAnimator(duration: 1, curve: .linear)
    private var intensity: CGFloat = 0.25
    
    init(intensity: CGFloat) {
        self.intensity = intensity
        super.init(effect: nil)
    }
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
    }
    
    deinit {
        animator.stopAnimation(true)
    }

    override func didMoveToSuperview() {
        guard let superview = superview else { return }

        backgroundColor = .clear
        frame = superview.bounds
        autoresizingMask = [.flexibleWidth, .flexibleHeight]
        clipsToBounds = true
        
        NotificationCenter.default.addObserver(
            self,
            selector: #selector(appWillEnterFG(_:)),
            name:UIApplication.willEnterForegroundNotification,
            object: nil
        )

        setUpAnimation()
    }
    
    private func setUpAnimation() {
        animator.stopAnimation(true)
        effect = nil

        animator.addAnimations { [weak self] in
            self?.effect = UIBlurEffect(style: .light)
        }
        animator.fractionComplete = intensity
    }
    
    @objc func appWillEnterFG(_ note: Notification) {
        setUpAnimation()
    }
}

Upvotes: 2

bodich
bodich

Reputation: 2235

We can do that absolutely natively and with correct expected look using animator

Usage:

let blurEffectView = BlurEffectView()
view.addSubview(blurEffectView)

BlurEffectView realisation:

class BlurEffectView: UIVisualEffectView {
    
    var animator = UIViewPropertyAnimator(duration: 1, curve: .linear)
    
    override func didMoveToSuperview() {
        guard let superview = superview else { return }
        backgroundColor = .clear
        frame = superview.bounds //Or setup constraints instead
        setupBlur()
    }
    
    private func setupBlur() {
        animator.stopAnimation(true)
        effect = nil

        animator.addAnimations { [weak self] in
            self?.effect = UIBlurEffect(style: .dark)
        }
        animator.fractionComplete = 0.1   //This is your blur intensity in range 0 - 1
    }
    
    deinit {
        animator.stopAnimation(true)
    }
}

Upvotes: 5

Michael Alfano
Michael Alfano

Reputation: 46

There is no official way to change the blur level.

However, you can try something like this:

Create a custom blur view

Upvotes: 0

Ethan Zhao
Ethan Zhao

Reputation: 249

I know this is late, but if you're just using blur for a modal presentations, apple has a built-in UIModalPresentationStyle called blurOverFullScreen, and it works pretty well.

Just set the parent controller's modalPresentationStyle to .blurOverFullScreen and present the new view controller. If the new view is smaller than the screen, the background should be blurred out like seen in your picture.

Upvotes: -1

Related Questions