Blur effect not appearing in UITableViewCell

Question

I'm trying to add a blur effect to my view. I created the blur effect like so

let blurLabel: UIVisualEffectView = {
    let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
    let blurEffectView = UIVisualEffectView(effect: blurEffect)


    return blurEffectView
    }()

Then I add it to the subview like so, and set up the constraints with it as well

 override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
        super.init(style: .subtitle, reuseIdentifier: reuseIdentifier)
        let view = tableViewCell

        addSubview(view)
        view.addSubview(blurLabel)

 blurLabel.leftAnchor.constraint(equalTo: self.leftAnchor,constant:0).isActive = true
        //blurLabel.topAnchor.constraint(equalTo: self.topAnchor, constant: 178).isActive = true
        blurLabel.widthAnchor.constraint(equalToConstant: 375).isActive = true
        blurLabel.heightAnchor.constraint(equalToConstant: 180).isActive = true

But when I run the application it doesn't appear at all

Arpit Dongre · Accepted Answer · 2017-03-03T10:51:49.433

0

Edit: As suggested by @HAS & @Fogmeister, you can also use translatesAutoResizingMaskIntoConstraints = false as it is better solution to use Auto Layout without specifying explicit frames.

You will have to assign frame to UIVisualEffectView like this:

 let blurLabel: UIVisualEffectView = {
    let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
    let blurEffectView = UIVisualEffectView(effect: blurEffect)
    blurEffectView.frame = CGRect(x: 0, y: 0, width: 60, height: 40) //give desirable frame
    return blurEffectView
 }()

edited Mar 03 '17 at 10:51

answered Mar 03 '17 at 05:16

Arpit Dongre

1,683
19
30

That shouldn't be necessary. Since you already use auto layout you should be able to just set the blur view's `translatesAutoResizingMaskIntoConstraints = false` so that auto layout does not try to give it a zero width and height (because you didn't initialize it with a frame it assumes a frame of {0, 0, 0, 0}). As Arpit said one possibility is to set a new frame but I think a cleaner solution is to use autolayout without explicit frames. – HAS Mar 03 '17 at 08:10
1

Yes, @HAS is correct here. What you need to do is to set `translatesAutoResizingMaskIntoConstraints = false`. Oh, yeah, he said that already :D – Fogmeister Mar 03 '17 at 10:42

score 0 · Answer 2 · answered Mar 03 '17 at 10:38

If you would like, instead of giving explicit frames you can also provide your blurView's to any of your view or, subviews.

let blurLabel: UIVisualEffectView = {
    let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
    let blurEffectView = UIVisualEffectView(effect: blurEffect)    
    blurEffectView.frame = myMainview.bounds //Blur effect's frame
    return blurEffectView
}()

override func viewDidLoad() {
    super.viewDidLoad()
    // Use it somewhere using
    self.view.insertSubview(blurEffectView, belowSubview: myAnotherView)
    // You may also use any of the subviews too, instead of the self.view
    /// self.myView.insertSubview(blurEffectView, belowSubview: myAnotherView)
}

score 0 · Answer 3 · answered Mar 03 '17 at 10:45

To fix this you just have to stop it automatically creating constraints. Like this...

let blurLabel: UIVisualEffectView = {
    let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
    let blurEffectView = UIVisualEffectView(effect: blurEffect)
    // this line will stop constraints being added for a zero frame
    blurEffectView.translatesAutoResizingMaskIntoConstraints = false
    return blurEffectView
}()

Blur effect not appearing in UITableViewCell

3 Answers3