cyril
cyril

Reputation: 3005

Why is the UINavigationBar turning black?

Problem:

I have a UITableViewController embedded in a UINavigationController. Pressing a cell in the table view switches to another table view controller. In said table view controller, I'd like for the navigation bar to be invisible while still keeping the tab bar items so I added the following to its viewDidLoad():

self.navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .default)
self.navigationController?.navigationBar.shadowImage = UIImage()
self.navigationController?.navigationBar.isTranslucent = true
self.navigationController?.navigationBar.tintColor = .black 

For the first UITableViewController, I'd like the navigation bar to be normal so in its viewDidAppear() I did the following:

self.navigationController?.navigationBar.isTranslucent = false

Everything is working fine except during the transition (which I am doing via performSegueWithIdentifier) the navigation bar on the first view controller disappears into blackness which looks ugly to be honest. Is there any way to prevent/fix this?

Screenshot: enter image description here

Upvotes: 26

Views: 19527

Answers (10)

Rahul Bansal
Rahul Bansal

Reputation: 1530

Below code works for me,

if (@available(iOS 13.0, *)) {
     UINavigationBarAppearance *appearance = [UINavigationBarAppearance new];
     [appearance configureWithOpaqueBackground];
     [appearance setBackgroundColor:UIColor.yellowColor];
     appearance.titleTextAttributes = @{NSForegroundColorAttributeName: UIColor.whiteColor};
     controller.navigationItem.standardAppearance = appearance;
     controller.navigationItem.scrollEdgeAppearance = appearance;
     controller.navigationItem.compactAppearance = appearance;
 }

Upvotes: 0

F. Morales
F. Morales

Reputation: 477

iOS 15 changed the way nav bars rendered. They are transparent by default. In most cases by default, no content is beneath the nav bars resulting in black color. The following code in AppDelegate(didFinishLaunchingWithOptions) fixed that for me.

if #available(iOS 15.0, *) {
        let navBarAppearance = UINavigationBarAppearance()
        navBarAppearance.configureWithOpaqueBackground()
        //Configure additional customizations here
        UINavigationBar.appearance().standardAppearance = navBarAppearance
        UINavigationBar.appearance().scrollEdgeAppearance = navBarAppearance
}

Upvotes: 15

Kudos
Kudos

Reputation: 1490

Below code helped me to get rid of black navigationBar in iOS 15+

if #available(iOS 15, *) {
            let textAttributes = [NSAttributedString.Key.foregroundColor: UIColor.black]
            let appearance = UINavigationBarAppearance()
            appearance.configureWithOpaqueBackground()
            appearance.titleTextAttributes = textAttributes
            appearance.backgroundColor = UIColor.white // UIColor(red: 0.0/255.0, green: 125/255.0, blue: 0.0/255.0, alpha: 1.0)
            appearance.shadowColor = .clear  //removing navigationbar 1 px bottom border.
            UINavigationBar.appearance().standardAppearance = appearance
            UINavigationBar.appearance().scrollEdgeAppearance = appearance
        }

Upvotes: 0

nastassia
nastassia

Reputation: 897

for me otherwise helped (Swift 5):

self.navigationController?.navigationBar.isTranslucent = false
self.navigationController?.navigationBar.barTintColor = UIColor.green //change to needed color

Upvotes: 1

GIJoeCodes
GIJoeCodes

Reputation: 1850

On viewDidLoad add:

extendedLayoutIncludesOpaqueBars = true

Upvotes: 1

Gal
Gal

Reputation: 207

Just change your navigationController view's backgroundColor

navigationController?.view.backgroundColor = // whatever

Upvotes: 14

hasan
hasan

Reputation: 24205

Change the window background color for you application to a color that suits you:

self.window?.backgroundColor = .white

Other solutions causes other problems in multiple inner screens.

Upvotes: 4

Echelon
Echelon

Reputation: 7922

I ran into this again recently, and discovered a way to fix it in the storyboard. If you're using opaque navigation bars, ensure the "Extend Edges" setting for "Under Opaque Bars" is set. In fact, I just set all three of them as shown below:-

enter image description here

Upvotes: 19

artemchen
artemchen

Reputation: 169

I had a very similar problem recently. Try setting self.navigationController?.navigationBar.translucent = true in both view controllers and self.edgesForExtendedLayout = UIRectEdgeNone.
Storyboard version: Extended Edges - Under Top Bars

Upvotes: 12

Kumuluzz
Kumuluzz

Reputation: 2012

You can animate the translucency of the navigation bar. So in the viewDidLoad for your second UITableViewController, you can write the following:

override func viewDidLoad() {
    self.navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
    self.navigationController?.navigationBar.shadowImage = UIImage()
    self.navigationController?.navigationBar.tintColor = .blackColor()

    // Play around with the duration until you find
    // a time interval, you find suitable
    UIView.animateWithDuration(2) {
        self.navigationController?.navigationBar.translucent = true
    }
}

Upvotes: 1

Related Questions