SwiftUI中如何优雅的 hide a TabBar

前言

SwiftUI - TabView

TabView是对UITabBarController的封装。本章包含TabView的基本使用，及TabView如何隐藏TabBar。

很遗憾新增API是从iOS 16开始。我们可以使用toolbar(_:for:)来隐藏应用程序中的标签栏。这个方法有两个参数:

.toolbar(.visible, for: .tabBar)

• visibility: of type Visibility, specifies the visibility we want to assign to the toolbar.

通过visibility指定我们想要分配给工具栏的可见性。

public enum Visibility {  
  case automatic  
  case hidden  
  case visible  
}

示例代码：

1.创建一个标签栏，并在其中添加一个名为HomeView的视图

要创建带有选项卡的用户界面，请将View放在TabView中，并对每个选项卡的内容应用tabItem(_:)修饰符。下面创建了一个有1个选项卡的TabView

struct ContentView: View {  
  var body: some View {  
     TabView {  
        HomeView()  
           .tabItem {  
               Label("", systemImage: "house.fill")  
           }  
        }  
    }  
}

• TabView只支持Text、Image或Image后跟Text的选项卡项。传递任何其他类型的视图都会导致一个可见但空的选项卡项；
• selection属性指示默认哪个tag选项卡选中；

2.准备一个DetailView的新视图

struct HomeView: View {  
    var body: some View {  
        NavigationStack {  
            NavigationLink("Navigate to detail") {  
                DetailView()  
            }  
        }  
    }  
}  
  
struct DetailView: View {  
    var body: some View {  
        Text("Detail View")  
    }  
}

3.使用toolbar(_:for:)方法来指定我们想要在导航到DetailView时隐藏。

struct HomeView: View {

  var body: some View {

    NavigationStack {

      NavigationLink("Navigate to detail") {

        DetailView()

          .toolbar(.hidden, for: .tabBar)

      }

    }

  }

}

效果图