Apple did a huge improvement on Autolayout in Xcode 5 such as the shortcuts on IB, controls, and ease of use. I think we should give auto layout a second chance since it will be a big help for us in the future, especially when Apple releases new devices with different screen sizes. Auto layout can help reduce large amounts of code.
6. Auto Layout is a system that lets you lay out
your app’s user interface by creating a
mathematical description of the relationships
between the elements.
You define these relationships in terms of
constraints either on individual elements, or
between sets of elements.
What is Auto Layout?
7. 1. It allows for more flexible layouts when
dealing with multiple screen sizes, interface
orientations, and languages.
2. You won’t do a lot of coding for layout.
Why use Auto Layout?
8. Auto Layout on Xcode 5
Auto Layout is enabled by default. When
you add an object in your xib in Xcode 4,
constraints(T-bars) appear immediately. We
tend to disable auto layout because it looks
frustrating.
Apple knows it. That’s why in Xcode 5, even
though Auto Layout is enabled, and you’re
not creating any constraints, the T-bars will
not appear.
9. Auto Layout on Xcode 5
In Auto Layout, if you set your button in that position and added
constraints, you are telling xcode that the button is on the top-
right position of the view, regardless of its orientation or screen
size.
When setting the button position without auto-layout, you can set its
position in the xib. But what if you change the orientation to
landscape or you have a different screen size? You have to write
code to set its position.
10. Add Constraints
There are 3 ways to add constraints.
● From the toolbar
● Using Interface Builder
● By Dragging Objects
11. Toolbar
Editor Menu is used for
auto layout. Just select
the object on the view
and select from the editor
which constraints you
want to add.
12. Interface Builder
On the bottom part of IB, there are
four buttons for auto layout.
● Align
● Pin
● Resolve Auto Layout Issues
● Resizing Behavior
It has the same content as the
Editor Menu
17. Dragging Object
You can also add
constraints by dragging
the object to another
object, then a menu will
popup and you can select
which constraints you
want.
19. Orange Line
When you add constraints on your object,
an orange line will appear. This means that
xcode cannot identify or compute the
position of that object. Xcode needs more
constraints to get more information on that
object.
20. Blue Line
If the T-bar is blue, it means that xcode has
sufficient information about the object.
21. Orange Line
When you manually adjust the position of
an object that already has constraints, an
orange line will appear. This means that
there is an error. You can solve this by
using the Resolve Auto Layout in Editor
Menu.
Select Editor > Resolve Auto Layout Issues
> Update Constraints
