Search code examples
iosswiftuinavigationcontrolleruinavigationbar

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


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:

enter image description here

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)

Solution

  • 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.