简体   繁体   中英

SwiftUI Show navigation bar title on the back button but not in the previous View

I have two views, one leads to the other. I want that the second view uses the title of the first view for the back button, which should then be: "<View1". I don't want to show the title in the first view.

Problem: I can't hide navigation bar because it will also hide a custom button which is within it. Setting .navigationTitle("") hides the title in the first view, but also hides it from the back button in the second view.

What I have now:

在此处输入图像描述 在此处输入图像描述

What I would like to have:

在此处输入图像描述 在此处输入图像描述

Code:

struct ContentView: View {
    @State var isLinkActive = false
    
    var body: some View {
        NavigationView {
            VStack {
            NavigationLink("go to the second view", destination: SecondView(), isActive: $isLinkActive).navigationTitle("View1")
                .navigationBarItems(leading: Button(action: {
                    ()
                }, label: {
                    Text("custom button")
                }))
            }
        }.navigationViewStyle(StackNavigationViewStyle())
        
    }
    
    private func btnPressed() {
        isLinkActive = true
    }
}

struct SecondView: View {
    var body: some View {
        Color.blue
    }
}

You need to create custom back button for destination view as well,and you shouldn't set navigation title for navigationLink , that's why you are not able to hide “View1” correctly.

Check below code.

import SwiftUI

struct Test: View {
    @State var isLinkActive = false
    
    
    var body: some View {
        NavigationView {
            VStack {
                NavigationLink("go to the second view", destination: SecondView()
                                .navigationBarBackButtonHidden(true)
                                .navigationBarItems(leading: Button(action: {
                                    isLinkActive = false
                                }, label: {
                                    HStack{
                                        Image(systemName: "backward.frame.fill")
                                        Text("View1")
                                    }
                                })) ,
                               isActive: $isLinkActive)
                
            }.navigationBarItems(leading: Button(action: {
                ()
            }, label: {
                Text("custom button")
            }))
        }.navigationViewStyle(StackNavigationViewStyle())
        
        
    }
    
    private func btnPressed() {
        isLinkActive = true
    }
}

struct SecondView: View {

    var body: some View {
        Color.blue
    }
}

You can try and make navigationBar code as reusable component, because you might need to do this at multiple places.

Output-:

在此处输入图像描述 在此处输入图像描述

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM