swiftui - 如何使用动态视图名称创建 SwiftUI 导航链接列表

Question

我正在尝试创建一个简单的视图列表供用户访问，我无法弄清楚如何用数组变量替换视图名称。在下面的示例中，destination: 被硬编码为 AVExample()，这是我的视图之一，但是如何使用数组中的名称？

struct test: View {
    
   var views = ["AVExample", "ColorPickerExample", "DatePickerExample"]
   
    var body: some View {
        
        NavigationView {
            List (views, id: \.self){ view in
                
                NavigationLink(
                    destination: AVExample(),
                    label: {
                        Text("\(view)")
                    })
            }
        }
    }
}

Answer 1

非常感谢您的回复。我想出了以下似乎效果很好的解决方案。

private struct aView {
    var id = UUID()
    var view: AnyView
    var label: String
}

private var views = [
    aView(view: AnyView(AppStorageExample()), label: "App Storage"),
    aView(view: AnyView(AppStoreRecommend()), label: "App Store Recommended"),
    aView(view: AnyView(AVExample()), label: "AV Player"),
    aView(view: AnyView(ColorPickerExample()), label: "Color Picker"),
]

var body: some View {
        List (views, id: \.id) { view in
            NavigationLink(
                destination: view.view,
                label: {
                    Text("\(view.label)")
                })
        }

}

Answer 2

您可以为视图创建一个结构，然后使用该结构数组。例如：

 struct ViewsList: Identifiable {
    static func == (lhs: ViewsList, rhs: ViewsList) -> Bool {
        return lhs.id == rhs.id
    }
    
    var id: Int
    var name: String
    var viewContent: AnyView
}

然后在您的视图类（测试）中，创建一个 ViewList 结构数组：

var views = [ViewsList.init(id: 1, name: "Example", viewContent: AnyView(AVExample())), ViewsList.init(id: 2, name: "ColorPicker", viewContent: AnyView(ColorPicker()))]

然后你可以循环这个数组，如下所示：

NavigationView {
            List (views, id: \.id){ view in
                
             NavigationLink(
                  destination: view.viewContent,
                  label: {
                        Text("\(view.name)")
             })
  }