Question

I can’t get my app to look nice on the iphone 5 or even reasonably presentable, it’s a mess. I don’t know where to start. The scroll view is in a random place and theres a grey bar at the bottom of the app. I have tried to get it to work by moving things around in the storyboard but then this ruins it for the old screens. I also switched autolayout on but then the app doesn’t work on ios5. Any help would be massively appreciated. Cheers

Answer 1

In general, if you have your springs and struts (or UIAutoresizingMasks) set up correctly, launching for the iPhone 5 shouldn’t be much additional effort. Also, if you are using lines of code such as [someView setFrame:CGRectMake(hardCodedX, hardCodedY, hardCodedWidth, hardCodedHeight)];, you’re just setting yourself up for failure. You’ll need to refactor this code to use positions relative to the screen size of the device (or of the superView). For complicated subview layouts that can’t be accomplished using springs and struts, you can override layoutSubviews and do your complicated setup there.

As you stated, if you are supporting iOS 5, Auto Layout isn’t an option.

You can find the springs/struts in your Storyboard. I outlined it in red here:

If you mouse over the box with the various I-beams, you can get a simulation of how the selected view will resize (you’ll see the image to the right of the box animate as it grows and shrinks).

Springs and struts are set for each individual view. These can be set programmatically using autoresizing masks. For the 4 I-beams on either side of the box, a solid line basically means “anchor the view at this position”. For the two perpendicular bars in the middle, a solid line means “the view is flexible in this direction” (either in width or height).

Springs and struts are all relative to the view’s superview.

For instance, if you wanted your view to be anchored to the top of its superview, but grow its height as its superview grows (e.g. the main view of a view controller would grow if the screen was taller as in the iPhone 5), you would want the top I-beam to be a solid line (anchor me to the top) and the vertical line inside the box to be solid (let me grow my height along with my superview). When you mouse over the box now, you would see the image to right have its top anchored, but grow and shrink in the vertical direction.