Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

In iOS13 the status bar background colour is different from the navigation bar in large text mode

Problems demo

Pre-conditions to reproduce the problem:

  1. Xcode 11 beta + iOS 13 (latest version until Jun. 12 2019)
  2. The navigation bar is in Large text mode
  3. Specify the colour of navigation bar.

The status bar will remain in white in a real device, above the green navigation bar.

Solutions I tried:

  1. Revert it back to iOS12 will solve it, but we will encounter iOS13 eventually...
  2. disabling the large text mode will solve it...
  3. hide the status bar will fix it, but it will cause status text overlapping with navigation bar item.

Any ideas? appreciate any help.

like image 899
steven Avatar asked Jun 12 '19 06:06

steven


People also ask

How do I change the background color on my status bar?

Step 1: After opening the android studio and creating a new project with an empty activity. Step 2: Navigate to res/values/colors. xml, and add a color that you want to change for the status bar.

How do I change the color of my status bar on my Iphone?

Go to the Storyboard. Select the View and in the Attributes Inspector change the Background Color to Light Gray. Build and Run the Project. The default style of the status bar is dark content.


2 Answers

No hacks or funkiness required here. The key is defining the desired appearance and setting this value on BOTH the nav bar's standardAppearance AND its scrollEdgeAppearance. I have the following in the init for my base navigation controller subclass for my entire app:

if #available(iOS 13.0, *) {     let navBarAppearance = UINavigationBarAppearance()     navBarAppearance.configureWithOpaqueBackground()     navBarAppearance.titleTextAttributes = [.foregroundColor: UIColor.white]     navBarAppearance.largeTitleTextAttributes = [.foregroundColor: UIColor.white]     navBarAppearance.backgroundColor = <insert your color here>     navigationBar.standardAppearance = navBarAppearance     navigationBar.scrollEdgeAppearance = navBarAppearance } 

enter image description here

like image 55
Mike Avatar answered Sep 24 '22 02:09

Mike


If the problem is that you'd like to give the navigation bar a color when the large title is showing, use the new UINavigationBarAppearance class.

let app = UINavigationBarAppearance() app.backgroundColor = .blue self.navigationController?.navigationBar.scrollEdgeAppearance = app 
like image 41
matt Avatar answered Sep 20 '22 02:09

matt