How to make a scroll view scroll *and* simultaneously satisfy constraints for different size devices

Question

I've got a view controller as follows, the layout below is shown on for iPhone XS. With this set of constraints I can flick between the different device views in the storyboard and everything adjusts there's no warnings/errors for the constraints.

However, the problem is that on an iPhone 8 and SE the size of the elements is too big to fit on the screen and the text view is compacted and not all the text is visible (the requirement is for all the text to be viewable without making the text itself scrollable. Hence this is the reason I put everything into a scroll view. But the problem is that on the iPhone 8/SE the scroll view does not actually scroll. After doing some research and from previous question the solution is to set the priority of the view.height = height (between the scroll view and its child) from the default of 1000 to 250.

This does indeed solve the problem of the scroll view not scrolling, and the end result on the iPhone 8 and SE is as intended - not all the text and button is visible on the screen but the user can scroll down to view them. Its also OK on an iPhone 8+ and XS. However, if I flip to the XR or XS Max views in the storyboard I now get a constraint error - saying Scroll View: Need constrains for Y position or height.

I've tried loads of things, but I'm unable to simultaneously get rid of all constraint errors at the same time as making the scroll view actually scroll on the smaller screen devices.

This has been driving me mad for ages, be appreciative for any advice on what is missing/incorrect here.

Answer 1

If you have constraints on the content of the "view" setup properly, you don't need to give it a height constraint at all.

Here is all you need:

Note: it can be very helpful to give your elements meaningful names to make it easy to know exactly which constraints belong to which "view".