iOS 7 Auto Layout

changing sizes of UILabel

I had some apps for iPhone and yesterday I decided to upgrade to iOS7 and make some modifications to be more friendly.

So I started with ToWatch. First I enabled the setting AutoLayout because the people said that is awesome how it works… in my opinion start with AutoLayout is a pain, but when you know exactly how is it, you will save a lot of time.

For example, “I want to change the size of the UILabel if the text is more than one line”, if you make a search of this in Google you will find different ways:

• change the line number to 0 (zero)
• get the size of the font, and then calculate the size that your text will have with the font number and then change the frame with this height
• change the frame with a max number and then make a new UILabel with this max height and see how much is the real height and then change your original UILabel with the new height.
• more and more and more and more…

All of this items didn’t work for me… I spent hours and hours and nothing change. So I start to said “Apple sucks”.

At the end of the day (without the changes) I don’t know why I disabled AutoLayout for the View, and everything start to work, but I WANT AUTO LAYOUT. So this is how I fixed the problem. Now is not necesary to change the height programatically, you can do it with auto height ;).

So if you click your UILabel in the Interface Builder you will see four icons at the bottom.

Then click the second icon with the name “Pin” and you will see this menu.

Now check the property “Height” and set a height… I set 20 because this is the size for one line.

Don’t forget to click “Add Constraints”

So now you will have your first contraints on your UILabel. This will tell to xCode “don’t modify the height… the height always will be 20px”, so now in the “Document Outline” you will see that your UILabel have an arrow in the left side, open it and open the group “Constraints”, and click on “Height — 20 — name of the label”. Now you will see in panel Utilities that you have some stuff about the constraint. Open the dropdown “Relation” and select “Greater than or equal”.

And done! now if the text inside UILabel need more space to fit xcode will change the height to make it bigger and fit the text.

If you enjoyed this, you should follow me on Twitter.