Real time blur effect for Navigation Bar - Status bar not getting in

Question

Followed this question to get real time blur effect in Navigation Bar:

func addBlurEffect() {
var bounds = self.navigationController?.navigationBar.bounds as CGRect!
var visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light)) as UIVisualEffectView
visualEffectView.frame = bounds
visualEffectView.autoresizingMask = .FlexibleHeight | .FlexibleWidth
self.navigationController?.navigationBar.addSubview(visualEffectView)
}

But the status bar remains translucent:

How to fix it?

Debugging:

    print(self.navigationController?.navigationBar.bounds)
    // Returns (0.0, 0.0, 320.0, 44.0)

    print(UIApplication.sharedApplication().statusBarFrame)
    // Returns (0.0, 0.0, 320.0, 20.0)

Have a look on this - http://stackoverflow.com/questions/27308842/real-time-blur-effect-for-navigation-bar/27316465#27316465 — Kampai, Jan 12 '16 at 13:46

score 2 · Accepted Answer · answered Oct 11 '15 at 17:39

2

It's partly because you set the visual effect view's frame to the navigation bar's bounds. What you see in the screen shot are the navigation bar's bounds. So, you might be able to compensate by giving your visual effect view a different frame, i.e. move its origin up 20 points and increase its height.

It's a little unclear to me, though, why you don't just make the navigation bar translucent. Navigation bar translucency is the blur effect, and it is supported. What you're doing — adding a subview to the navigation bar — is not.

answered Oct 11 '15 at 17:39

matt

515,959
87
875
1,141

Hey @matt, I'm using [LTNavigationBar](https://github.com/ltebean/LTNavigationBar) library. I could not make it work with the straightforward ".translucent" way. I managed to adjust the bounds from your answer, thanks. I will add it if someone else need it. – Damasio Oct 11 '15 at 23:55
1

If my answer helped you, please accept it. Next time, please give relevant information (like, you're using some third-party library) _when you ask your question_. Thanks. – matt Oct 12 '15 at 00:02

score 1 · Answer 2 · answered Oct 11 '15 at 23:58

1

Managed to get it working adding this:

bounds.offsetInPlace(dx: 0.0, dy: -20.0)
bounds.size.height = bounds.height + 20.0

answered Oct 11 '15 at 23:58

Damasio

496
5
14

This merely does what I said to do; it adds nothing. – matt Oct 12 '15 at 00:02

score 0 · Answer 3 · answered Jul 13 '18 at 08:37

As for this problem, I have modified Kampai's earlier answer, which the original was posted here.

The code below would blur the status bar as well as navigation bar.

Swift 4:

func navigationBarBlur() {
    let bounds = CGRect(x: 0.0, y: -20.0, width: UserDefaults.screenWidth, height: (self.navigationController?.navigationBar.bounds.size.height)! + 20.0)
    let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .dark))
    self.visualEffectView = visualEffectView
    visualEffectView.frame = bounds
    visualEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
    self.navigationController?.navigationBar.addSubview(visualEffectView)
}

Real time blur effect for Navigation Bar - Status bar not getting in

3 Answers3

Linked