Change statusBar background color when using a large title for navigation bar on iOS 11

Question

I am trying to use the new navigationBar large header feature on iOS 11.

However, after adding the following line:

self.navigationController?.navigationBar.prefersLargeTitles = true 

I found that the background color of the navigationBar changed to black.

So, I set the background color again:

 self.navigationController?.setBackgroundColor(UIColor(hexString: 0xFF7E79)) 

However, I found that the background color of the statusBar has not changed:

After I set the background color to statusBar through this code:

 guard let statusBar = UIApplication.shared.value(forKeyPath: "statusBarWindow.statusBar") as? UIView else { return statusBar.backgroundColor = UIColor(hexString: 0xFF7E79) 

This gives me an ugly 1px black line, like this between statusBar and navigationBar:

So what is the right way to set the background color of the navigation bar?

Answer 1

The correct way to set the background color of the UINavigationBar is to use the barTintColor property.

 self.navigationController?.navigationBar.barTintColor = .red 

You may notice that the color you set may fade a little. As stated in the documentation:

This color is made translucent by default, unless you set the isTranslucent property to false .

See the barTintColor developer.apple.com link