带有 TabView 和登录/注销状态 swiftui 的 NavigationViews

Question

这是我现在代码的总体结构。基本上我正在尝试制作一个用户必须登录才能使用的应用程序。用户登录后，他们将进入选项卡视图。现在我遇到一些问题，有时我会在屏幕顶部看到双导航栏/工具栏。我担心我当前的 NavigationViews 设置会导致问题。

@main
struct MyApp: App {
    
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

struct ContentView: View {
    var isSignedIn: Bool
    
    var body: some View {
        NavigationView {
            if isSignedIn {
                MainTabView()
            } else {
                WelcomeScreenView()
            }
        }
    }
}

struct WelcomeScreenView: View {
    
    var body: some View {
        ZStack {
            VStack {
                NavigationLink(destination: SignUpView(),
                               label: {
                    PrimaryButton(title: "Sign Up")
                })
            }
        }
    }
}

struct MainTabView: View {
    
    var body: some View {
        TabView {
            
            HomeView()
                .tabItem {
                    Image(systemName: "house.fill")
                    Text("Home")
                }
            
            SearchView()
                .tabItem {
                    Image(systemName: "magnifyingglass")
                    Text("Search")
                }
                .navigationViewStyle(.stack)
            
            ProfileView()
                .tabItem {
                    Image(systemName: "person.fill")
                    Text("Profile")
                }
                .tag(Tab.profile)
        }
    }
}

struct HomeView: View {
    
    var body: some View {
        NavigationView {
            ZStack {
                VStack {
                    Text("Home")
                }
            }
        }
    }
}

struct SearchView: View {
    
    var body: some View {
        NavigationView {
            ZStack {
                VStack {
                    Text("Search")
                }
            }
        }
    }
}

struct ProfileView: View {
    
    var body: some View {
        NavigationView {
            ZStack {
                VStack {
                    Text("Profile")
                }
            }
        }
    }
}

我尝试过移动导航视图，但这似乎只会导致更多问题。

Answer 1

TabView

必须始终位于顶部，不能位于另一个导航结构内。

https://developer.apple.com/design/ human-interface-guidelines/tab-bars

您可以将代码更改为类似的内容

struct ContentView: View {
    var isSignedIn: Bool
    
    var body: some View {
        
        if isSignedIn {
            MainTabView()
        } else {
            NavigationView {
                WelcomeScreenView()
            }
        }
    }
}

另请注意，

NavigationView

在 iOS 16 中已弃用，

NavigationStack

是一个更好的选择。

https://developer.apple.com/documentation/swiftui/migration-to-new-navigation-types