ios - UICollectionView 和 SwiftUI？

Question

如何使用 SwiftUI 创建方形项目网格(例如在 iOS 照片库中)？

我尝试过这种方法，但它不起作用:

var body: some View {
    List(cellModels) { _ in
        Color.orange.frame(width: 100, height: 100)
    }
}

List 仍然具有 UITableView 样式:

Answer 1

iOS 14 和 XCode 12

iOS 14 的 SwiftUI 带来了一个易于使用的新原生 GridView ，称为 LazyVGrid: https://developer.apple.com/documentation/swiftui/lazyvgrid

您可以从定义GridItem 的 数组开始。 GridItems 用于指定每一列的布局属性。在这种情况下，所有 GridItem 都是灵活的。

LazyVGrid 将 GridItem 的数组作为其参数，并根据定义的 GridItems 显示包含的 View 。

import SwiftUI

struct ContentView: View {
    
    let columns = [
        GridItem(.flexible()),
        GridItem(.flexible()),
        GridItem(.flexible()),
        GridItem(.flexible())
    ]
    
    var body: some View {
        ScrollView {
            LazyVGrid(columns: columns) {
                ForEach(0...100, id: \.self) { _ in
                    Color.orange.frame(width: 100, height: 100)
                }
            }
        }
    }
}