iOS ScrollView needs constraint for y position or height

ios objective-c autolayout storyboard scrollview
Bioaim picture Bioaim · Feb 25, 2016 · Viewed 37.4k times · Source 
-ViewController
--View
---ScrollView (Top,Bottom,Leading,Trailing spaces to superview set to 0)
----ContentView (Top,Bottom,Leading,Trailing spaces to superview set to 0, Width equals with View (ViewController's child))
-----Label1
-----etc...

If i set a specific height constraint for my content view (e.g. 1000) the ScrollView works fine, but i got a static ContentView of 1000, which is not my goal, because my contentView got dynamic content, so it should be the height the content needs.

If i delete the height constraint for my ContentView, Xcode says:

Missing Constraints:
ScrollView need constraints for: Y position or height

ScrollView is actually pinned at top and bottom, so i don't know why Xcode want's a height constraint for the ScrollView...

What is the right way to go, when i want the ContentView height to be the height the content needs?

Answer

Bharat Modi picture Bharat Modi · Feb 25, 2016

Whenever using ScrollView with auto layout always follow below steps,

  1. ScrollView constraints: leadingSpace, topSpace, TrailingSpace, bottomSpace to superView and make sure when you control drag to add constraint, add it by pressing alt so that the constraint would be set without margin.

  2. Add UIView inside scroll view as container view and set its constraints: leadingSpace, topSpace, trailingSpace, bottomSpace to ScrollView without pressing alt button and set equalWidth to ScrollView.

  3. Whatever views you add inside this container view must have top to bottom constraint that is all view's should have vertical constraint, so containerView can calculate height required for itself based on the content inside it.

If the constraints are set correctly then the scrollView will set its content size automatically based on the component inside it and you do not need to set the content size manually, also the scrollView will only scroll if the component inside the container view is not fitting inside otherwise it won't scroll. If you want to make it scroll anyways then you need to check the Bounces Vertically property from storyboard to get the bounce effect.

Note: While you set constraint to the component inside the scrollView, you will see the constraint warning till you set the constraint from top component to the bottom one, aways remember that your top component should have top constraint (Vertical constraint) to superView and the component at the bottom should have bottom space constraint to the super view. When this satisfy then all warning will disappear eventually.

ScrollView constraints:

enter image description here

ContainerView constraints:

enter image description here

Related questions

Auto Layout and "Hide bottom bar when pushed"

My app's (simplified) structure is this: UITabBarController with one UINavigationController holding a UITableViewController as root view controller. when tapping one of the table view controller cells, I push a regular UIViewController (lets call it VC) end hiding the bottom tab …

Read More
How do I animate constraint changes?

I'm updating an old app with an AdBannerView and when there is no ad, it slides off screen. When there is an ad it slides on the screen. Basic stuff. Old style, I set the frame in an animation block. …

Read More
Creating layout constraints programmatically

I know that a lot people already asked tons of questions about this, but even with the answers I can't make it work. When I'm dealing with constraints on storyboard, it's easy but in code I have a hard time. …

Read More