clarity about Xcode 6 constraints

Question

I have an app that I am in the process of updating from iOS 7 to 8 and trying to take advantages of the new size classes Apple now offers. The one thing that I just seem to be having tons of trouble with is how the constraint system works. I've worked through some tutorial and look at other postings, and things still don't seem to be working in my favor.

First I will explain my file structure as well a provide some images, just in case I'm not clear on what I have.

My View Controller is set up like so:

View Controller View Navigation Bar Keyboard Avoid Scroll View (UIScrollView) View What Kind (child View) NameOFBill AmountOwedView OptionalView ReminderView Save And here is a screen grab of that structure:

For my constraints I set the Navigation Bar and the Keyboard Avoiding (UIScrollView) to 0 top right left and bottom. See Image below.

Now up until this point, all is going well. Xcode is NOT complaining about anything missing.

So up next is the View inside the scrollView which I am using as a container for all the content inside the scrollView. When I try to repeat the process from about I get some constraint warnings.... but why? I gave it a constraint on the top right left and bottom, why is that not enough for Xcode to know how why and tall it should be. It seems that is wants a width and height for the view as well. Buy if I set the width, then it assumes the width of 600 which is much too wide for any iPhone.

I'm sure my thinking is not correct somewhere.. i just don't know where and why. I truly want to understand how this system works, so any insight be would helpful

Thanks!!

** Update **

Here is what the inspector looks like :

And here is what Xcode is complaining about

Answer 1

UIScrollView's are a special case when it comes to constraints. The constraints on the immediate child of the UIScrollView actually set the contentSize of the scroll view. It's actually quite powerful, as it means you can fill that UIView with stuff, and as long as you have set all the constraints appropriately it will automatically set the contentSize of the UIScrollView without you having to do anything in code. You will get an "ambiguous scrollable content" warning however if you don't have constraints pinning the child UIView to the scroll view in every direction, as this is how it figures out what the contentSize is.

However, this means that you can't expect the child UIView pinned to the left and right of the UIScrollView to match the width of the UIScrollView, because the width by default is determined by it's contents.

There is a way around this however. You can select both the UIScrollView and the UIView in Interface Builder, and add an "Equal Widths" constraint. This will get around the setting of the contentSize, and actually match the width of the UIView to the frame width of the UIScrollView.

Hope that helps.

Answer 2

You can solve the "Misplaced Views" warning by selecting the view and pressing Command+Option+=. This updates the frame of the view to match the constraints it has. The warning basically says that the constraints of the view don't march its frame as it appears in Interface Builder.

The "Scrollable Content Size Ambiguity" message is probably due to the fact that the views inside your scroll view are lacking some constraints. If IB can't determine where those views should be placed, it can't set the contentSize of the scroll view correctly. Go through your views inside the scroll view and make sure they don't miss any constraints.

EDIT:

On the screenshot below you can see how you can either update the frame of a view (same as pressing Command+Option+=), OR do the opposite: update the constraints based on the current position of the view in IB. Try clicking "Update Constraints" (or even "Reset to Suggested Constraints") if you think your view is positioned correctly in IB, and you want your constraints to match that positioning.