iPhone 4 & 5 Autoresize Vertical Space

Question

I built my views in Interface Builder for iPhone 4 dimensions. I thought that the Autoresize Constraints in iOS 6 will take care of the resizing automatically. The screenshot shows the Top Space constraint that Xcode added automatically. It says that the relationship between the top and the bottom orange view must be 332 points.

When viewed in iPhone 5, the orange button is stretched all the way to the bottom as you can see in the screenshot below.

When changing the relation to Greater Than or Equal, the view does not change and remains the same. When removing the constant to make it Auto, the view is stretched across the entire screen. How do I specify a constraint were the height is 44 points and at the bottom?

Answer 1

Don't have a constraint to the top of the superview. Pin it to the bottom of the superview, and fix the height to 44, then delete the constraint linking it to the top of the view.

You achieve the pinning by selecting the view in question and using the pinning menu in interface builder (the floating menu with three icons on it, or editor-->pin from the menu bar).

To move between 3.5 and 4 inch displays, you need to link content to the correct edge of the superview. Stuff at the bottom should be stuck to the bottom.

I have written about constraint editing in interface builder here if you're interested.

Answer 2

Try adding your own contraints (user constraint), In Auto Layout for each object there must always be enough constraints to determine both its position and size on different devices screen.

Interface Builder automatically creates constraints for you as soon as you place a view in a layout. Try placing your views along IB’s automatic guides to help it guess correctly which layout you want.

Prior to Xcode 4 it was done by setting the springs and struts from the Interface Builder and the springs and struts model is still the default, so for every programmatically created view that you want to use autolayout with, dont forget to call

setTranslatesAutoresizingMaskIntoConstraints:NO.