Правильный выбор выравнивания и распределения для горизонтального StackView

Question

Ниже приведен скриншот с дизайном, который я хочу реализовать.

Для этого я использую вертикальный вид стека, который охватывает четыре других горизонтальных стека. Затем каждый горизонтальный вид в стеке включает изображение и метку, как показано ниже.

Я установил alignment горизонтальных стеков fill и попытался изменить Distribution. Однако я не могу получить желаемый результат.

Какая комбинация alignment / distribution может дать желаемый эффект? Или я должен исключить горизонтальные стековые представления и заполнить представления внутри вертикального стекового просмотра?

Answer 1

Выполните шаги,

1. Добавьте vertical stackView с top, leading and trailing constraints к view.

Alignment - Fill
Distribution - Fill
Spacing - 20

2. Добавьте 1 horizontal stackView к vertical stackView

Alignment - Fill
Distribution - Fill
Spacing - 20

3. Добавьте imageView с height and width constraints set to 30 в вышеупомянутом horizontal stackView.

4. Дублируйте horizontal stackView в vertical stackView количество раз согласно вашему требованию.

Answer 2

Вы можете сделать это с помощью tableView, но если у вас есть несколько элементов, то

установка интервала для основного стека и каждый внутренний стека должен давать необходимый отступ

для полного просмотра посмотрите демо

https://github.com/ShKhan9/stackV