如何在 SwiftUI 中列出一系列 TabView 项目?

fan*_*ber 5 tabview swift swiftui

我有一个项目,其中的部分ContentView应该在选择不同的选项卡时发生变化。我有以下结构和 TabView 项目的数组:

struct TabItem: Identifiable {
    var id = UUID()
    var title: Text
    var image: Image
    var tag: Int
}

let tabData = [
    TabItem(title: Text("Tab 1"), image: Image(systemName: "1"), tag: 1),
    TabItem(title: Text("Tab 2"), image: Image(systemName: "2"), tag: 2),
    TabItem(title: Text("Tab 3"), image: Image(systemName: "3"), tag: 3),
    TabItem(title: Text("Tab 4"), image: Image(systemName: "4"), tag: 4)
]
Run Code Online (Sandbox Code Playgroud)

我试图在里面列出这些,TabView但无法弄清楚如何这样做。尝试了以下方法,但到目前为止还没有运气。

TabView {
    ContentView()
        .tabItem {
        // code goes here...
        }.tag // tag goes here
}
Run Code Online (Sandbox Code Playgroud)

我知道我也可以使用TabView(selection: )with@State变量,但我也不知道如何实现。

谢谢!

小智 7

TabView 可以显示如下(属性selectedTab跟踪用户选择的选项卡):

import SwiftUI

struct ContentView: View {
    let tabData = [
        TabItem(title: Text("Tab 1"), image: Image(systemName: "1"), tag: 1),
        TabItem(title: Text("Tab 2"), image: Image(systemName: "2"), tag: 2),
        TabItem(title: Text("Tab 3"), image: Image(systemName: "3"), tag: 3),
        TabItem(title: Text("Tab 4"), image: Image(systemName: "4"), tag: 4)
    ]

    @State private var selectedTab = 0

    var body: some View {

        TabView(selection: $selectedTab) {

            ForEach(tabData) { tabItem in
                Text("Screen: \(tabItem.tag)")
                    .tabItem {
                        tabItem.title
                        tabItem.image
                }.tag(tabItem.tag)
            }
        }

    }
}

struct TabItem: Identifiable {
    var id = UUID()
    var title: Text
    var image: Image
    var tag: Int
}
Run Code Online (Sandbox Code Playgroud)