SwiftUI 將視圖從第一個屏幕更改為 tabview 屏幕

Question

一旦用戶點擊“開始”，我想更改視圖，但由於在我的第一個視圖中有導航視圖，它在我的下一個屏幕上顯示了我不想要的后退按鈕。 請參閱下面的圖片。

第一個視圖的代碼如下： import SwiftUI

結構內容視圖：查看{

var body: some View {
    NavigationView {
        VStack {
            Spacer()
            Text("LifePath")
                .font(.system(size: 48, weight: .semibold))
                .padding(.bottom)
            Spacer()
            
            
            
            NavigationLink(destination: ViewChanger()) {
                Text("Get Started")
                    .font(.headline)
                    .navigationBarBackButtonHidden(true)
            }
        }
        .padding()
    }
}

}

屏幕 2 上顯示的后退按鈕

第一視角

Answer 1

更改您的navigationBackButtonHidden修飾符的位置，以便它實際修改您要訪問的視圖（而不是NavigationLink標簽）：

struct ContentView: View {
    
    var body: some View {
        NavigationView {
            VStack {
                Spacer()
                Text("LifePath")
                    .font(.system(size: 48, weight: .semibold))
                    .padding(.bottom)
                Spacer()
                
                
                
                NavigationLink(destination: ViewChanger()
                                .navigationBarBackButtonHidden(true) // <-- Here
                ) {
                    Text("Get Started")
                        .font(.headline)
                        
                }
            }
            .padding()
        }
    }
}

如果您不僅希望后退按鈕消失，而且希望整個 header 欄消失，則可以使用.navigationBarHidden(true)修飾符。

此外，如果您完全在 iPad 上運行它，您可能希望.navigationViewStyle(StackNavigationViewStyle())添加到NavigationView的外部

Answer 2

如果您使用 NavigationLink（在 NavigationView 中），則會推送視圖。 如果要替換視圖，可以使用if語句來完成。

例如，這可以這樣實現：

struct ContentView: View {
    @State var showSecondView: Bool = false

    var body: some View {
        if !showSecondView {
            NavigationView {
                VStack {
                    Spacer()
                    Text("LifePath")
                        .font(.system(size: 48, weight: .semibold))
                        .padding(.bottom)
                    Spacer()
            
                    Button(action: { showSecondView = true }) {
                        Text("Get Started")
                            .font(.headline)
                    }
            }
            .padding()
        } else {
            TabView {
                // ...
            }
        }
    }
}