Simple steps to get Auto Layout to work in Xcode 5.1


#1

This worked for me. I had the HARDEST time getting this to work on iPad and iPhone devices.

Everything would be fine until I added the UIImageView. SAVE THAT ONE for last.

Here are the steps that worked for me using XCODE 5.1.
After doing each one of these steps you should NOT get a red or yellow icon notification in UIBuilder.

[ul]
Select Name label.
Anchor it’s LEFT and TOP edges as well as make the HEIGHT fixed.
Select Name textfield. Set it’s LEFT, TOP and RIGHT anchors. Give it a FIXED height.
Select Serial label. Give it a LEFT, TOP anchor and a fixed height.
Select Serial text field. Give it left, top and right anchor with a fixed height.
– follow the same pattern with the VALUE row components –
Select ‘date’ LABEL and give it actors on left, right and top. Give it a fixed height.
NOW SELECT THE TOOLBAR.
Give it anchors at the left, bottom and right. Give it a fixed height.
NOW select the image and give it 4 anchors on the top, bottom, left and right. With aspect ratio set it will adjust to fill the space as expected.
[/ul]

Hope this helps someone.

Things I’ve discovered the hard way.

If AFTER you’ve made an edit you get an ORANGE, RED or YELLOW, warning or drawing in the frame do a CTRL-Z and UNDO your last edit.
AutoLayout wants AS MANY AS POSSIBLE constraints when you make an edit to an UI element in the view.
A FIXED HEIGHT is acceptable but I would NOT SUGGEST getting in the habit of doing a FIXED LENGTH and FIXED HEIGHT for your labels. If you have to support internationalization the font height will work but NOT the length.

The two chapters on auto layout are not easy. Hang in there but don’t expect to rip thru those sections in an hour each. :wink:

Good luck!


#2

Unless I’ve missed something, we weren’t asked to constrain the UIImageView in chapter 15 at all.

Chapter 16 explains exactly how to constrain the UIImageView and you do not need to fix the height of the other components to do so. You need to set a hugging priority and compression resistance priority to a value less than the other components. I also had to fix the bug of the disappearing valueField as explained on p314. I’m using Xcode 5.1 too.


#3

[quote=“monkeyboy”]Unless I’ve missed something, we weren’t asked to constrain the UIImageView in chapter 15 at all.

Chapter 16 explains exactly how to constrain the UIImageView and you do not need to fix the height of the other components to do so. You need to set a hugging priority and compression resistance priority to a value less than the other components. I also had to fix the bug of the disappearing valueField as explained on p314. I’m using Xcode 5.1 too.[/quote]

I had issues getting it to work as expected on both iPhone and iPad devices.

The book works GREAT with iPhone screens but I had issues with iPad layouts.

Thanks for your comment. That very well could have been my problem.

I found setting the UIImageView Hugging and Resistance values to all be 50 and letting it be the last control to ‘fill’ that area fixed all of my issues.

Kind regards