UICollectionView和SwiftUI？

如何使用SwiftUI创建正方形项目的网格（例如在iOS照片库中）？

我尝试了这种方法，但是不起作用：

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

列表仍然具有UITableView样式：

一种可能的解决方案是将您包装UICollectionView成UIViewRepresentable。请参阅合并和创建视图 SwiftUI教程，其中将其包装MKMapView为示例。

到目前为止UICollectionView，SwiftUI中没有类似的东西，并且还没有计划。看到有关该推文的讨论。

要获取更多详细信息，请查看Integrated SwiftUI WWDC视频（〜8：08）。

QGrid是我创建的一个小型库，该库使用与SwiftUI的List视图相同的方法，通过从标识的数据的基础集合中按需计算其单元格：

假设您已经具有自定义单元格视图，QGrid则最简单的形式就是将它与您体内的这1行代码一起使用View：

struct PeopleView: View {
  var body: some View {
    QGrid(Storage.people, columns: 3) { GridCell(person: $0) }
  }
}   

struct GridCell: View {
  var person: Person
  var body: some View {
    VStack() {
      Image(person.imageName).resizable().scaledToFit()
      Text(person.firstName).font(.headline).color(.white)
      Text(person.lastName).font(.headline).color(.white)
    }
  }
}

您还可以自定义默认布局配置：

struct PeopleView: View {
  var body: some View {
    QGrid(Storage.people,
          columns: 3,
          columnsInLandscape: 4,
          vSpacing: 50,
          hSpacing: 20,
          vPadding: 100,
          hPadding: 20) { person in
            GridCell(person: person)
    }
  }
} 

请参考GitHub回购中的演示GIF和测试应用程序：

https://github.com/Q-Mobile/QGrid