Как «выровнять» HStack по вертикали

У меня проблема: я использую цикл ForEach для создания пользовательского представления в представлении. Я хочу, чтобы они были выровнены следующим образом (я сделал это, создав 3 HStack внутри VStack):

Ожидание

Но я использую ForEach, как следствие, я ограничен только "1 стеком". Я получаю что-то вроде этого:

Эта проблема

Вот код, который касается только ScrollView :

ScrollView(.vertical, showsIndicators: true) {
                    HStack{
                        ForEach(styles, id: \.id) { style in // styles is an array that stores ids.
                            
                            MusicStyleTabView(style: style, selectedBtn: self.$selected)// This view is the "cell" in question.
                            
                        }
                    }
                }

Итак, как я могу выровнять VStack по горизонтали?