View embedded in a NavigationView (where latter has navBar hidden) glitches every time it is pushed on to the View [SwiftUI]

Viewed 44

I have been struggling with this for the past hour mainly because all the solutions I have seen seem more hack-y than real solutions, and this is making me question the production readiness of NavigationBar in SwiftUI.

I have a MainView and a PushView, and I need to hide the navBar on both the Views. However, this creates the following issues:

1)When the PushView is pushed onto the MainView, there is a glitch where the nav bar appears and then disappears.

2)Going back to MainView is now not possible because the back button in PushView is also now hidden.

What I want is my own button in PushView that pops this View and goes back to HomeView

What am I doing wrong:

struct HomeView: View {
    var body: some View {

        NavigationView {

            NavigationLink(destination: PushView()) {
                Text("PRESSME")
            }.navigationBarTitle("")
            .navigationBarHidden(true)

        }
    }
}

struct PushView: View {

    var body: some View {
        Text("Hello View Two")
    }
}
1 Answers

Yes, the NavBar is a bit buggy as you have already experienced yourself.

A clean solution which is not hacky in my opinion looks like this:

struct HomeView: View {
    var body: some View {

        NavigationView {

            NavigationLink(destination: PushView()) {
                Text("PRESSME")
            }.navigationBarTitle("")
                .navigationBarHidden(true)

        }
    }
}

struct PushView: View {
    @Environment(\.presentationMode) var presentationMode

    var btnBack : some View {
        Button(action: {
            self.presentationMode.wrappedValue.dismiss()
        }) {
            Image(systemName: "chevron.left")
        }
    }

    var body: some View {
        VStack {
            HStack {
                btnBack // Your custom back button.
                    .padding()
                Spacer()
            }
            Spacer()
            Text("Hello View Two")
            Spacer()
        }
        .navigationBarTitle("")
            .navigationBarHidden(true) // This hides the NavBar on PushView.
    }
}
Related