iPhone X - Hidden status bar pushes Navigation Bar upwards

ios uinavigationcontroller uinavigationbar statusbar iphone-x
Roi Mulia picture Roi Mulia · Sep 29, 2017 · Viewed 12.6k times · Source

I'm testing iPhone X behavior using the Xcode simulator. For some odd reason, if I'm hiding the Status Bar the Navigation Bar pushed upwards causing the title to completely disappear and cutting the left and right buttons. This is happening only on the iPhone X.

Illustration:

enter image description here

How can I hide the status bar and keep the Navigation Bar at a visible position?

UPDATE:

Sample project for your convince:

https://drive.google.com/file/d/0B5qJARV-Oc9ra1hvZkpXZm9lRUE/view?usp=sharing

Answer

nathangitter picture nathangitter · Sep 29, 2017

One solution is to embed the navigation controller inside a container view controller which is properly constrained to the safe area.

storyboard setup

Just create another view controller and drag a "Container View" from the Object Library. This view has top, bottom, leading, and trailing constraints to the safe area, all with constants equal to 0. If you control-drag from the container view to the navigation controller, you'll get an option to set an "embed segue" which will embed the selected view controller as a child view controller.

I set the status bar to be hidden on the new view controller I created, and it works fine.

screenshot of working layout on iPhone X

This feels like something that UINavigationBar should handle automatically, but this workaround seems like it should work pretty well.

Another note: if you change the color of the navigation bar, you'll also need to create another view above the container view, and change its color to match the color of the navigation bar.

Related questions

How to add a right button to a UINavigationController?

I am trying to add a refresh button to the top bar of a navigation controller with no success. Here is the header: @interface PropertyViewController : UINavigationController { } Here is how I am trying to add it: - (id)initWithNibName:(NSString *)nibNameOrNil …

Read More
How to hide a navigation bar from first ViewController in Swift?

How can I hide a navigation bar from first ViewController or a particular ViewController in swift? I used the following code in viewDidLoad(): override func viewDidLoad() { super.viewDidLoad() self.navigationController?.isNavigationBarHidden = true } and also on viewWillAppear: override func viewWillAppear(animated: …

Read More
Navigation bar show/hide

I have an app with a navigation bar consisting of 2 bar buttons. I would like to hide and show this navigation bar when a user double taps the screen. Initially, the navigation bar should be hidden. When a user double …

Read More