How can I create a multiline/wrap-able HStack/VStack?

Question

Created Nov ’20

Replies 3

Boosts 0

Views 6.9k

Participants 4

Hello,

I am trying to create an HStack with an array of my custom view that has images and information taken from my database model, that when it reaches the end of the window, it takes the rest of the cells (my custom views) below to the next line. Then if you resize the window, or change the size of the cells (through a slider) it should reorder the cells so they fit the window without needing horizontal scrolling.

I have made numerous attempts to try to find a way to do this, but I couldn't find any way to make it work correctly.

I am developing a macOS app in macOS 10.15, so I only have SwiftUI 1 available.

Could someone help me?

Boost

Answer 1

Claude31 OP

Nov ’20

It seems what you need here is a CollectionView.

Unfortunately, they do not exist natively in SwiftUI (!), so you would have to wrap a UIKit CollectionView.

Tutorial here:
https ://medium .com/flawless-app-stories/how-to-build-collectionview-in-swiftui-a13baf738730

0

Answer 2

robnotyou OP

Nov ’20

In the current version of SwiftUI, you would use a LazyVGrid to achieve this.

Since you are specifying an older SwiftUI, there is no built-in solution, and you will have to create your own.

1

Answer 3

daniel.klock OP

Mar ’21

If your data won't fit a "Grid" structure, I believe WrappingHStack will do what you want

1