使用协议来捕获SwiftUI视图。

Question

我正在尝试编写一个协议，要求符合者具有View属性，或者具有返回某些View的@ViewBuilder方法。

我想要一个可重用的组合视图，可以基于需要显示的数据类型构建不同的子视图。

该协议应该如下所示...

protocol RowView {
    var leftSide: some View { get }
    var rightSide: some View { get }
}

这样我就可以像这样调用某些东西...

struct Example: RowView {
    var id: Int
    var leftSide: some View { … }
    var rightSide: some View { … }
}

struct ContentView: View {
    let rows: [RowView]

    var body: some View {
        VStack {
            Foreach(rows, id: \.id) {
                HStack {
                    $0.leftSide
                    $0.rightSide
                }
            }
        }
    }
}

- Mercutio

Answer 1

您需要将协议更改为类似以下内容：

protocol RowView {
    associatedtype LView: View
    associatedtype RView: View

    var leftSide: LView { get }
    var rightSide: RView { get }
}

此外，在内容视图中使用具体的Example类型，而不是协议（您定义的协议完全没有id）：

let rows: [Example]

此外，您可以根据需要将RowView设置为identifiable，因此不再需要id:\.id：

protocol RowView: Identifiable

一段可用的代码：

protocol RowView: Identifiable {
    associatedtype LView: View
    associatedtype RView: View

    var leftSide: LView { get }
    var rightSide: RView { get }
}

struct Example: RowView {
    var id: Int
    var leftSide: some View { Text("Left") }
    var rightSide: some View { Text("Right") }
}

struct ContentView: View {
    let rows: [Example] = [
        .init(id: 1),
        .init(id: 2)
    ]

    var body: some View {
        VStack {
            ForEach(rows) { row in
                HStack {
                    row.leftSide
                    row.rightSide
                }
            }
        }
    }
}

- Mojtaba Hosseini