Stack view within a scroll view doesn't scroll

Question

I've been having such a hard time with this issue for the past 2 days. The structure I'm looking for is as follows:

1. I want to have a scroll view take up the entire screen so that it's scrollable vertically.
2. I want the image view to be added at the top of the scroll view and a vertical stack view to be added to below.

The key point is for the vertical stack view to increase in its height dynamically depending on the content.

First, I just tried adding the stack view without the image view just to test out the dynamic scrollable height. Followed the SO answer from here:

1. Added the scroll view with 0, 0, 0, 0 constraints.
2. Added the stack view to the scroll view. Set the constraints to the Content Layout Guide, 0, 0, 0, 0 constraints.
3. Set the width of the stack view to be equal the scroll view.

This gave me a constraint error saying I need to set a fixed height for the scroll view. Adding the constraint doesn't let me scroll. I tried pinning the stack view to the scroll view directly, and not to the Content Layout Guide, but still doesn't work.

I followed Apple's documentation on the scroll view and added a content view within the scroll view before pinning the stack view to the content view:

This doesn't scroll either.

The stack view's distribution was either set at equal spacing or fill.

Please help.

Answer 1

This answer did work for me.

Add the scroll view and pin four edges to safe area. Make sure value of constraints is 0.

Add the stackview inside scrollview and pin four edges to scrollview with constraint value 0.

Set stack view's width equal to scroll view's width.

Add as many views inside stackview.

To test if scrolling works, set fixed height for views inside stackview to make sure that scrollview has scrollable height. Then with the stackview selected, drag with two fingers inside the viewcontroller. The stackview should scroll within the scrollview.

This is how the constraints are set: