How to edit the UIBlurEffect intensity?

Once I ran into a problem to create a blur effect that is darker than .light and lighter than .dark UIBlurEffect style.

To achieve that, put a view on the back with the color and alpha you need:

    let pictureImageView = // Image that you need to blur
    let backView = UIView(frame: pictureImageView.bounds)
    backView.backgroundColor = UIColor(red: 100/255, green: 100/255, blue: 100/255, alpha: 0.3)
    pictureImageView.addSubview(backView)

    let blurEffect = UIBlurEffect(style: .light)
    let blurEffectView = UIVisualEffectView(effect: blurEffect)
    blurEffectView.frame = pictureImageView.bounds
    pictureImageView.addSubview(blurEffectView)

How the result looks like:

enter image description here

For more details, check out this article.

UPDATE: apparently there is another nice (maybe even nicer) way to implement the Blur using CIFilter(name: "CIGaussianBlur"). It allows the make “opacity” and blur’s strengths much lower than UIBlurEffect.


You can do that in super elegant way with animator

(reducing UIVisualEffectView alpha will not affect blur intensity, so we must use animator)

Usage as simple as:

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)
    }
}

Adjusting the blur itself is not possible... But, you can adjust how visible the blur view is. This can be done in a number of ways, only three of which I can think of at the moment:

1st Option: Adjust the alpha of your UIVisualEffectView instance e.g:

effectView.alpha = 0.4f;

2nd Option: Add a UIView instance to effectView at Index 0 and adjust the alpha of this UIView instance. e.g:

UIView *blurDilutionView = [[UIView alloc] initWithFrame: effectView.frame];
blurDilutionView.backgroundColor = [[UIColor whiteColor] colorWithAlphaComponent: 0.5];
blurDilutionView.autoresizingMask = UIViewAutoresizingFlexibleTopMargin|UIViewAutoresizingFlexibleBottomMargin|UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight;//if not using AutoLayout
[effectView insertSubview:blurDilutionView atIndex:0];

3rd Option: use multiple UIVisualEffectView instances (I have not tried this yet, more of an idea). Apply an alpha of 0.1f on each. The more UIVisualEffectView views you have the more blurry the overall look. Once again, I have not tried this option yet!

Update: As Axeva mentioned in the comments, Apple advises against adjusting the alpha to change the blur. So use these suggestions at your own potential peril.


UIBlurEffect doesn't provide such a property. If you want another intensity, you will have to make a BlurEffect by yourself.

Tags:

Swift