Swift基础之TabView

使用TabView

今天介绍TabView，这个组件类似于UIKit中的UITabbar。

struct ContentView: View {

    var body: some View {

        TabView(selection: .constant(2),
                content:  {
            Text("页面1").tabItem {
                Group {
                    Text("Tab1")
                    Image(systemName: "square.and.arrow.up")
                }
            }.tag(1)
            
            Text("页面2").tabItem {
                Group {
                    Text("Tab2")
                    Image(systemName: "tray")
                }
            }.tag(2)

            Text("页面3").tabItem {
                Group {
                    Text("Tab3")
                    Image(systemName: "arrow.down.doc")
                }
            }.tag(3)

            Text("页面4").tabItem {
                Group {
                    Text("Tab4")
                    Image(systemName: "arrowshape.forward")
                }
            }.tag(4)

        }).accentColor(.red)

    }

}

预览图如下：

在这个方法里面：

• 参数selection是Binding类型，我在这里使用constant(2)，这里和tag里面的内容一一对应，所以，默认会选中第二个tab
• Text("xxxx")为每个tab所展示页面的内容，我这里用最简单的方式展示，复杂的情况，可以单独封装一个View
• tabItem是每个标签的内容，可以是图文，也可以是单独文字或者图片
• accentColor(.red)表示选中时候的颜色样式