Swift navigation bar how to remove black top bar

In order to change color of navigation bar for all view controllers, you have to set it in AppDelegate.swift file

  • Add following code to didFinishLaunchingWithOptions function in AppDelegate.swift

var navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.tintColor = uicolorFromHex(0xffffff)
navigationBarAppearace.barTintColor = uicolorFromHex(0x034517)

  • In here tintColor attribute change the background color of the navigation bar
  • barTintColor attribute affect to the color of the
  • back indicator image
  • button titles
  • button images
  • This code not affect to the color of navigation bar title. It still remains on black color

Swift navigation bar how to remove black top bar

Swift navigation bar how to remove black top bar

Change color of navigation bar title

  • Add following code to didFinishLaunchingWithOptions function in AppDelegate.swift

var navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.tintColor = uicolorFromHex(0xffffff)
navigationBarAppearace.barTintColor = uicolorFromHex(0x034517)
// change navigation item title color
navigationBarAppearace.titleTextAttributes =[NSForegroundColorAttributeName:UIColor.whiteColor()]

  • var navigationBarAppearace = UINavigationBar.appearance() navigationBarAppearace.tintColor = uicolorFromHex(0xffffff) navigationBarAppearace.barTintColor = uicolorFromHex(0x034517) // change navigation item title color navigationBarAppearace.titleTextAttributes =[NSForegroundColorAttributeName:UIColor.whiteColor()]

    2 affect to the title text, in here I'm setting the title text color white

Swift navigation bar how to remove black top bar

Programatically change navigation bar title

  • In order to change title of the navigation item(in ViewController) you have to set the title in

    var navigationBarAppearace = UINavigationBar.appearance() navigationBarAppearace.tintColor = uicolorFromHex(0xffffff) navigationBarAppearace.barTintColor = uicolorFromHex(0x034517) // change navigation item title color navigationBarAppearace.titleTextAttributes =[NSForegroundColorAttributeName:UIColor.whiteColor()]

    3 function of ViewController

override func viewDidLoad() {
    super.viewDidLoad()
    self.navigationItem.title = "New title"
}

  • Following is an example output after this change

Swift navigation bar how to remove black top bar

Change status bar color

  • In above examples status bar color is Black
  • In order to change the color of status bar we have do two changes

First define the property of

var navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.tintColor = uicolorFromHex(0xffffff)
navigationBarAppearace.barTintColor = uicolorFromHex(0x034517)
// change navigation item title color
navigationBarAppearace.titleTextAttributes =[NSForegroundColorAttributeName:UIColor.whiteColor()]

4 property in your

var navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.tintColor = uicolorFromHex(0xffffff)
navigationBarAppearace.barTintColor = uicolorFromHex(0x034517)
// change navigation item title color
navigationBarAppearace.titleTextAttributes =[NSForegroundColorAttributeName:UIColor.whiteColor()]

5 file(In setting it to

var navigationBarAppearace = UINavigationBar.appearance()
navigationBarAppearace.tintColor = uicolorFromHex(0xffffff)
navigationBarAppearace.barTintColor = uicolorFromHex(0x034517)
// change navigation item title color
navigationBarAppearace.titleTextAttributes =[NSForegroundColorAttributeName:UIColor.whiteColor()]

6)

Apple updated how navigation bars look in iOS 15 (once your app is build with Xcode 13) and now they are by default transparent if there isn't any content behind them.

So in practice this means that the old "bar" with different background is now gone and comes back only after you scrolled the content.

Because this is enabled by default, it might cause visual issues for your app. I had to fix this in couple apps and here is how do to it.

You need to use the UINavigationBarAppearance which is available since iOS 13.

Restoring pre-iOS15 look

Apologies for the syntax coloring.. looks like the `

available` is causing issues

The basic fix looks like this:

`if

available(iOS 15.0, *) {
let navigationBarAppearance = UINavigationBarAppearance() 
navigationBarAppearance.configureWithDefaultBackground() 
UINavigationBar.appearance().standardAppearance = navigationBarAppearance 
UINavigationBar.appearance().compactAppearance = navigationBarAppearance 
UINavigationBar.appearance().scrollEdgeAppearance = navigationBarAppearance 
}

`

The configureWithDefaultBackground makes the navigation bar appear as translucent.

The main key here is that we are setting the new scrollEdgeAppearance to be the same as standard one. This turns off the automatic transparency for all navigation bars in your app, since with the UINavigationBar.appearance() we are using the appearance proxy. The code above should ideally go to AppDelegate when the app starts.

Toggling transparency with this API

Another issue I had to solve was that the app I needed to fix toggled navigation bar to be transparent on some screens and the old way of doing this no longer worked with Xcode 13.

The switching now looks like this:

`if

available(iOS 15.0, *) {
if isTransparent {
    let navigationBarAppearance = UINavigationBarAppearance()
    navigationBarAppearance.configureWithTransparentBackground()
    navigationController.navigationBar.tintColor = .white
    navigationItem.scrollEdgeAppearance = navigationBarAppearance
    navigationItem.standardAppearance = navigationBarAppearance
    navigationItem.compactAppearance = navigationBarAppearance
} else {
    let navigationBarAppearance = UINavigationBarAppearance()
    navigationBarAppearance.configureWithDefaultBackground()
    navigationController.navigationBar.tintColor = .label
    navigationItem.scrollEdgeAppearance = navigationBarAppearance
    navigationItem.standardAppearance = navigationBarAppearance
    navigationItem.compactAppearance = navigationBarAppearance
}
navigationController.setNeedsStatusBarAppearanceUpdate()
}

`

Of course the colors used here are for illustration. Feel free to use any other. Don't forget you can use the preferredStatusBarStyle property to control which style should the system status bar use.

How do I hide the top navigation bar in Swift?

You need to apply . navigationBarHidden(true) on the DetailView if you want the navigation bar to remain hidden.

How do I remove shadow from navigation bar Swift?

Using this method navigationController?. navigationBar. setValue(true, forKey: "hidesShadow") in viewWillAppear the shadow bar is hidden in the current visible view controller.

How do I remove the navigation bar border in Swift?

One is the background image, and the other is the shadow image. First, we'll hide the shadow image, by setting it to empty image and see how it looks. Now, we'll also hide the background image just like shadow image, and it will look like the navigation bar has disappeared.

How to hide navigation bar in SwiftUI?

SwiftUI's toolbar() modifier lets us hide or show any of the system bars whenever we need, which is particularly useful when you have a TabView that you want to hide after a navigation push. If you don't specify an exact bar to hide – if you write just toolbar(. hidden) without specifying for: .