如何在SwiftUI中切换选项卡栏和工具栏？

Question

在文件 App 中，当您按下选择按钮后，选项卡栏会切换到工具栏。 我该如何使用 SwiftUI 实现这个功能？（在选项卡栏和工具栏之间进行切换）

struct tabBar: View {
  
    var body: some View {
        TabView {
            ContentView().tabItem {
                Image(systemName: "paperplane.fill")
                Text("tabBar")
            }
        }
        .toolbar {
            ToolbarItem(placement: .bottomBar, content: {
                Button(action: {
                }){
                    Text("toolBar1")
                }
         
            })
            ToolbarItem(placement: .bottomBar, content: {
                
                Button() {
                } label: {
                    Text("toolBar2")
                }
             
            })
        }

    }
}

- fdvfarzin

Answer 1

对于 iOS 16 及以上版本，您可以使用 toolbar(_:for:) 方法在可见和隐藏状态之间切换。此外，请不要忘记将视图包装在 NavigationView 中，否则底部工具栏的可见性设置将无法生效。

import SwiftUI

struct ContentView: View {
    @State var shouldShowTabBar = false

    var body: some View {
        NavigationView {
            TabView {
                Group {
                    Button("Switch Between Tab Bar and Toolbar") {
                        shouldShowTabBar.toggle()
                    }
                    .tabItem {
                        Label("Tab 1", systemImage: "list.dash")
                    }

                    Text("Tab 2")
                        .tabItem {
                            Label("Tab 2", systemImage: "square.and.pencil")
                        }
                }
                .toolbar {
                    ToolbarItem(placement: .bottomBar) {
                        Button {

                        } label: {
                            Text("Toolbar Button")
                        }
                    }
                }
                .toolbar(shouldShowTabBar ? .visible : .hidden, for: .tabBar)
                .toolbar(shouldShowTabBar ? .hidden : .visible, for: .bottomBar)
            }
        }
    }
}

如果您需要支持iOS 14和15，您可以逐个检查每个项目是否应该可见，并逐个隐藏/显示它们。

import SwiftUI

struct ContentView: View {
    @State var shouldShowTabBar = false

    var body: some View {
        NavigationView {
            TabView {
                Group {
                    Button("Switch Between Tab Bar and Toolbar") {
                        shouldShowTabBar.toggle()
                    }
                    .tabItem {
                        if shouldShowTabBar {
                            Label("Tab 1", systemImage: "list.dash")
                        }
                    }

                    Text("Tab 2")
                        .tabItem {
                            if shouldShowTabBar {
                                Label("Tab 2", systemImage: "square.and.pencil")
                            }
                        }
                }
                .toolbar {
                    ToolbarItem(placement: .bottomBar) {
                        if !shouldShowTabBar {
                            Button {

                            } label: {
                                Text("Toolbar Button")
                            }
                        }
                    }
                }
            }
        }
    }
}

- Tamás Sengel

---

谢谢你的回答，有没有办法让应用程序针对iOS 15及以上版本进行定位？ - fdvfarzin