Navigation Bar Behind Status Bar

by Ryan Hedges

You might find yourself in an situation where you want to use the UINavigationBar API to create a navigation bar in one of your views. But it doesn’t look quite right. It doesn’t extend up behind the status bar like you’ve seen it do countless times before when using a UINavigationController. What gives? How do you extend the navigation bar behind the status bar in your iOS app?

Navigation Bar not behind Status Bar


The solution is actually really simple to implement, but how to do it using swift may prove to be more challenging to find online.

All you need to do is extend an object, like your view controller, to conform to the UINavigationBarDelegate and implement position(for:) to return UIBarPosition.topAttached

class SomeViewController: UIViewController {

    private let navigationBarView: UINavigationBar = {
        let nav = UINavigationBar(frame: .zero)
        // Configure navigation bar...
        return nav

    override func viewDidLoad() {
        view.backgroundColor = UIColor.init(red: 187/255, green: 42/255, blue: 97/255, alpha: 100)

        // Assign your delegate object
        self.navigationBarView.delegate = self

        let navBar = navigationBarView

        navBar.translatesAutoresizingMaskIntoConstraints = false
        navBar.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
        navBar.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
        navBar.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor).isActive = true

        // Any other view needs

extension SomeViewController: UINavigationBarDelegate {
    func position(for bar: UIBarPositioning) -> UIBarPosition {
        return UIBarPosition.topAttached

Navigation Bar not behind Status Bar

Please note, you may want to handle the delegate function more gracefully depending on your needs.

extension SomeViewController: UINavigationBarDelegate {
    func position(for bar: UIBarPositioning) -> UIBarPosition {
        guard self.navigationBarView == bar as? UINavigationBar else {
            return bar.barPosition
        return UIBarPosition.topAttached

Hopefully this helps you continue creating a UINavigationBar with the look and feel that you want for your application.

Sample Project

If you want to see it in action and play with it yourself, you can download the sample project from our sample projects repo on GitHub.

If you have any comments or questions about this post or the sample project please feel free to email us or submit a new github issue. We’d love to hear from you!

More from the Blog

If you found this valuable, we need your help! Drop your email address below to show your support. We promise, no spam. We will keep you in the loop with new developments in our products and startup hacks we think you will find valuable.

What are you interested in?

* indicates required