Navigation Bar hide is not working in SwiftUI

Question

I'm having Three Views. I want to hide the navigation bar in the third View. Even if I give .navigationBarHidden(true) the navigation bar is displaying!

I couldn't find where I'm doing wrong. I've attached my code and the resulting screenshot below.

Xcode version - 11.1

struct ContentViewOne: View {
    var body: some View {
        NavigationView {
            ZStack {
                
                Color.yellow.edgesIgnoringSafeArea(.all)
                VStack(spacing: 20) {
                    Text("View One")
                    
                    NavigationLink(destination: ContentViewTwo()) {
                        Text("Navigate to View Two")
                            .foregroundColor(.white)
                            .padding()
                            .background(Color.red)
                    }
                }
            }
            .navigationBarTitle("View One")
        }
    }
}

struct ContentViewTwo: View {
    var body: some View {
        
        ZStack {
            Color.green.edgesIgnoringSafeArea(.all)
            VStack(spacing: 20) {
                Text("View Two")
                NavigationLink(destination: ContentViewThree()) {
                    Text("Navigate to View Three")
                        .foregroundColor(.white)
                        .padding()
                        .background(Color.red)
                }
            }
        }
        .navigationBarTitle("View Two")
    }
}

struct ContentViewThree: View {
    var body: some View {
        ZStack {
            Color.gray.edgesIgnoringSafeArea(.all)
            Text("View Three")
        }
        .navigationBarTitle("View Three")
        .navigationBarHidden(true)
        .navigationBarBackButtonHidden(true)
    }
}

https://stackoverflow.com/questions/29209453/how-to-hide-a-navigation-bar-from-first-viewcontroller-in-swift — Ernist Isabekov, Nov 25 '19 at 08:56

score 42 · Accepted Answer · answered Nov 25 '19 at 10:29

42

NOTE: (For some reason it works in some cases) SwiftUI requires that you need to .navigationBarTitle for .navigationBarHidden to work properly.

NavigationView {
    ScrollView() {
     ......
    }.  
    .navigationBarTitle("") //this must be empty
    .navigationBarHidden(true)
    .navigationBarBackButtonHidden(true)
}

answered Nov 25 '19 at 10:29

Rohit Makwana

4,337
1
21
29

When adding `.navigationBarTitle("")` in a view inside a TabBar, the label of that Tab is being erased upon selecting it. What I did is to set the label of the tab again instead of "" – Alan Steiman May 13 '20 at 11:58
This is mindless, besides it needs to be added in each view of the navigation. – 93sauu Jul 30 '20 at 16:59
if you put NavigationView and you want to hide it. you have to write code for hidden. its bug of SwiftUI – Rohit Makwana Jul 31 '20 at 10:51
and also getting a warning: "changing items while animating can result in a corrupted navigation bar" – zdravko zdravkin Dec 23 '20 at 14:21
4

Adding `.navigationBarHidden` to ScrollView worked for my case. – jonye._.jin Mar 15 '21 at 16:12
3

Not working in iOS 15 – Tanvirgeek Mar 09 '22 at 11:43
@TanvirgeekLet me check and update – Rohit Makwana Mar 09 '22 at 17:47
Not working in iOS 16.3 – David.C Mar 26 '23 at 18:27

Miroslav Kuťák · Answer 2 · 2021-02-12T21:53:45.123

I tried multiple solutions, including UINavigationControllerDelegate and nothing seems to make the navigationBar permanently hidden. Until I tried KVO :)

So if you want a permanent solution, use this:

struct NoBarNavigationView<Content: View>: View {

    private let content: Content

    init(@ViewBuilder content: () -> Content) {
        self.content = content()
    }

    var body: some View {
        NavigationView {
            content
                .introspectNavigationController { (UINavigationController) in
                    NavigationControllerDelegate.shared.becomeDelegate(of: UINavigationController)
                }
        }
    }
}

class NavigationControllerDelegate: NSObject {

    static let shared = NavigationControllerDelegate()

    func becomeDelegate(of navigationController: UINavigationController) {
        navigationController.isNavigationBarHidden = true
        navigationController.navigationBar.isHidden = true
        navigationController.navigationBar.addObserver(self, forKeyPath: "alpha", options: .new, context: nil)
    }

    override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {
        // This is necessary to ensure the UINavigationBar remains hidden
        if let navigationBar = object as? UINavigationBar {
            navigationBar.isHidden = true
        }
    }

}

Happy coding!

EDIT: As pointed out in the comments, I am using:

import Introspect

GitHub link

You should probably show the `import Introspect` and [link](https://github.com/siteline/SwiftUI-Introspect) to the GitHub. — George, Feb 11 '21 at 21:35
wow thats something that i've been looking for so long and that was the only thing that worked for me so far! thanks a lot! — dreampowder, Mar 23 '22 at 10:14

score 4 · Answer 3 · answered Aug 20 '20 at 18:51

4

Posting this for more visibility in dealing with SwiftUI NavigationBar not hiding, or still taking up space when it is hidden:

.navigationBarHidden(true)
.navigationBarTitle("", displayMode: .inline)
.edgesIgnoringSafeArea([.top, .bottom])

That sets a title (hack sometimes required for old swiftUI versions), hides the bar, but also tells the rendering engine to ignore any safe areas that reserve space for the navigation bar (presumptively).

answered Aug 20 '20 at 18:51

smakus

1,107
10
11

Line `.navigationBarTitle("", displayMode: .inline)` alone did the trick for me. It is important to set it after `.navigationBarHidden(true)` – CedricSoubrie Jan 28 '22 at 16:01
1

This was a solution for me. I don't even have a navigation view. – MGY Nov 22 '22 at 08:52

score 2 · Answer 4 · answered Nov 25 '19 at 09:01

To hide the NavigationBar specifically in your 3rd View. You have to remove .navigationBarTitle("View Three") and the bar gets hidden:

struct ContentViewThree: View {
    var body: some View {
        ZStack {
            Color.gray.edgesIgnoringSafeArea(.all)
            Text("View Three")
        }
        .navigationBarHidden(true)
        .navigationBarBackButtonHidden(true)
    }
}

Jan · Answer 5 · 2022-09-15T07:52:45.110

2

With iOS 15.5 and 15.6 .navigationBarHidden(true) simply doesn't work. Adding .navigationBarTitle("", displayMode: .inline) doesn't help either. It's obviously a bug in iOS 15.

It's fixed in iOS 16!

Tested with Xcode 14 Simulated iOS 15.5, iPhone w/ iOS 15.6 and iOS 16 on an iPhone X, the bug got fixed in iOS 16.

edited Sep 15 '22 at 07:52

answered Sep 06 '22 at 13:39

Jan

1,032
11
26

score 1 · Answer 6 · answered Dec 14 '20 at 20:03

1

You need to add .navigationBarHidden(true) on navigationView, or if you have NavigationLink you need to add on the Link

   NavigationLink("",
                               destination: Text("TEST"),
                               tag: linkValue,
                               selection: $linksNavigator.selection)
                    **.navigationBarHidden(true)**

answered Dec 14 '20 at 20:03

zdravko zdravkin

2,090
19
21

wow, this is such a strange behaviour, to have to set navigatoinbarHidden for all the navigation links you have on the page as well – andrei Feb 15 '21 at 18:07
I've found this also hides the navigation bar on the view holding the navigation link (possibly this is how it works as the child view inherits the status of the parent?) – sally2000 Apr 20 '21 at 19:13
1

Unfortunately this didn't work for me :( – Rachael Sep 25 '22 at 05:59

Mucahid Uslu · Answer 7 · 2022-01-16T17:26:57.823

Because you should add hidden properties to DetailView instead of NavigationLink,

 NavigationLink(destination: DetailView(mData: sportData)
                                .navigationBarTitle("")
                                .navigationBarHidden(true)
                                .navigationBarBackButtonHidden(true)
                
                ) {
                    Image("arrowRight3").resizable()
                    //.padding(5)
                    //.background(.red)

score 0 · Answer 8 · answered Jun 09 '22 at 08:52

In iOS 15 you can use a @State property to toggle the state.

@State private var hideNavigationbar: Bool = false

You switching the value in .onAppear {} to true. When you dismiss the view you call .onDisappear {} and set the property to false.

Now you can use it like so:

.navigationbarHidden(hideNavigationbar)

score 0 · Answer 9 · answered Dec 10 '22 at 08:50

0

The latest hiding method, suitable for iOS15


.navigationBarHidden(true)
.ignoresSafeArea()

answered Dec 10 '22 at 08:50

gaohomway

2,132
1
20
37

Navigation Bar hide is not working in SwiftUI

9 Answers9

Linked