Left aligned horizontal stackview and top aligned vertical stackview

Question

I have two StackView, one of which is horizontal and another vertical.

For the horizontal StackView, I want the items to be aligned to the left and grow toward the right.

For the vertical StackView, I want the items to be aligned to the top and grow downward. For example the position of the top item would never change but the stackview expands down if another item is added.

I'm having trouble accomplishing this, for example with my horizontal StackView, if I have two items 40x40, they will example the entire width of screen for some reason and I've tried a whole slew of different variations of distribution, alignment and constraints.

For my vertical StackView, if I add two items, my first item will move up and the second item will go underneath, so the center is now between the two instead of the first item staying still and the second going underneath it.

I can't figure out what I'm doing wrong here and how to just get StackViews where the first item is sized correctly, in place, and future items follow it, expanding either rightwards or downwards.

Answer 1

What you need is for Vertical

1- Drag a UIStackView with top , leading and trailing constraints to the superView

2- Drag any view inside it and give it a height constraint

for Horizontal

1- Drag a UIStackView with top , leading and height constraints to the superView

2- Drag any view inside it and give it a width constraint

Note : Make distribution set to fill