UICollectionView and SwiftUI?

Evgeny Mikhaylov picture Evgeny Mikhaylov · Jun 5, 2019 · Viewed 30.2k times · Source

How to create grid of square items (for example like in iOS Photo Library) with SwiftUI?

I tried this approach but it doesn't work:

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

List still has UITableView style:

enter image description here

Answer

Maciek Czarnik picture Maciek Czarnik · Jun 7, 2019

One of the possible solutions is to wrap your UICollectionView into UIViewRepresentable. See Combining and Creating Views SwiftUI Tutorial, where they wrap the MKMapView as an example.

By now there isn’t an equivalent of UICollectionView in the SwiftUI and there’s no plan for it yet. See a discussion under that tweet.

To get more details check the Integrating SwiftUI WWDC video (~8:08).

Update:

Since iOS 14 (beta) we can use Lazy*Stack to at least achieve the performance of the collection view in the SwiftUI. When it comes to the layout of cells I think we still have to manage it manually on a per-row/per-column basis.