How to achieve this layout in SwiftUI?

[ajeas]

Hey guys, I’m curious does anyone know how I would go by achieving this layout? (the image on left)

So far, I’m using the LazyVGrid to create the 2 columns with fixed widths of 150. I have an array of items (from core data) and I want every odd item to expand 2 columns like the green card in image. Any suggestions?

Thanks in advance!

[Chris_Parker]

@ajeas

Hi Ajea,

It’s an interesting question. You need some method of determining whether to have 2 cards per row and then switch to 1 card per row but the ForEach, which is looping over your data is already inside the LazyVGrid.

There might be something in this article from SwiftUI-Labs that you can use.

Impossible Grids with SwiftUI - The SwiftUI Lab

[ajeas]

Thanks Chris! that article helped I added in a geometry reader as well, now I’m getting the desired result

[ekraus0227]

That looks great! great job getting that figured out!

[ajeas]

Thanks @ekraus0227!