SwiftUI 表滚动到

Question

有谁知道是否有一个系统可以滚动到 SwiftUI 表中的一行？我知道我可以使用 List/ScrollView/ScrollViewReader 组合，但理想情况下我正在寻找与Table. 我确实尝试在表格周围使用 ScrollViewReader，但这没有任何作用

https://developer.apple.com/documentation/SwiftUI/Table

我理想地在桌子上寻找一种方法，或者类似的东西TableReader

struct Person: Identifiable {
    let givenName: String
    let familyName: String
    let emailAddress: String
    let id = UUID()
}
private var people = [
    Person(givenName: "Juan", familyName: "Chavez", emailAddress: "juanchavez@icloud.com"),
    Person(givenName: "Mei", familyName: "Chen", emailAddress: "meichen@icloud.com"),
    Person(givenName: "Tom", familyName: "Clark", emailAddress: "tomclark@icloud.com"),
    Person(givenName: "Gita", familyName: "Kumar", emailAddress: "gitakumar@icloud.com")
.... 100 more....
]

var body: some View {
  ScrollViewReader { proxy
    Table(people) {
        TableColumn("Given Name", value: \.givenName)
        TableColumn("Family Name", value: \.familyName)
        TableColumn("E-Mail Address", value: \.emailAddress)
    }
    .onChange(of: selection) { newValue in
        proxy.scrollTo(newValue, anchor: .center)
      }
  }
}

Answer 1

您可以通过提供一组选定的 ID 或单个选定的 ID，使用 ScrollViewReader 滚动到表中的一行。

@State private var selectedPerson: Person.ID?

var body: some View {
    ScrollViewReader { proxy in
        VStack {
            Button {
                selectedPerson = people.randomElement()?.id
            } label: {
                Text("Scroll")
            }

            Table(people, selection: $selectedPerson) {
                TableColumn("Given Name", value: \.givenName)
                TableColumn("Family Name", value: \.familyName)
                TableColumn("E-Mail Address", value: \.emailAddress)
            }
            .onChange(of: selectedPerson) { newValue in
                withAnimation {
                    proxy.scrollTo(newValue, anchor: .center)
                }
            }
        }
    }
}

我制作了一个随机滚动或每当您点击一行时滚动的示例。输出：