在垂直和水平方向上延迟加载 SwiftUI Grid

Question

正如标题所说，我尝试构建一个在垂直和水平方向上延迟加载的网格视图，主要目标是为员工列表构建日历，列表和日历间隔都可以非常大，因此它们必须是懒惰地渲染。我尝试过

LazyHGrid

和

LazyVGrid

但它们仅在一个方向上延迟渲染视图。另一种方法对整个视图使用一个

LazyVStack

，对每一行使用一个

LazyHStack

，加载是延迟的（检查控制台中的打印），但在滚动视图时会丢失其位置并且网格会损坏

struct ContentView: View {
    var body: some View {
        ScrollView([.horizontal, .vertical]) {
            LazyVStack(spacing: 20, pinnedViews: .sectionHeaders) {
                Section(header: columnHeaders) {
                    ForEach(0..<20) { row in
                        LazyHStack(spacing: 20, pinnedViews: .sectionHeaders) {
                            Section(header: rowHeader(with: "Employee \(row)")) {
                                ForEach(0..<100) { column in
                                    Text("Cell \(row), \(column)")
                                        .foregroundColor(.white)
                                        .font(.largeTitle)
                                        .frame(width: 200, height: 100)
                                        .background(Color.red)
                                        .onAppear {
                                            print("Cell \(row), \(column)")
                                        }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    
    var columnHeaders: some View {
        LazyHStack(spacing: 20, pinnedViews: .sectionHeaders) {
            Section(header: rowHeader(with: "")) {
                ForEach(0..<100) { column in
                    Text("Header \(column)")
                        .frame(width: 200, height: 100)
                        .background(Color.white)
                }
            }
        }
    }
    
    func rowHeader(with label: String) -> some View {
        Text(label)
            .frame(width: 100, height: 100)
            .background(Color.white)
    }
    
}

PS：我还需要固定标头，这是在上面的代码中使用

pinnedViews

实现的

Answer 1

您可以通过使用一对嵌套的单轴 ScrollView 而不是一个多轴 ScrollView 来修复未对齐问题。

Answer 2

这个问题你找到答案了吗？