Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Start a free Basic trial
to watch this video
Auto Layout is built on top of a robust algorithm known as the Cassowary linear arithmetic constraint solving algorithm. In this video, let's understand the basic premise of the Cassowary algorithm.
Further Reading
-
0:00
Layout isn't a simple thing for a computer to solve and
-
0:03
many people have attempted to solve the problem in different ways.
-
0:07
Back in 2001, two computer scientists at the University of Washington,
-
0:12
Greg Badros and Alan Borning, along with Peter Stuckey
-
0:16
of the University of Melbourne, wrote a paper detailing their approach and
-
0:20
called it The Cassowary Linear Arithmetic Constraint Solving Algorithm.
-
0:25
Cassowary, according to the authors, is an incremental constraint solving toolkit
-
0:31
that efficiently solves systems of linear equalities and equalities.
-
0:36
Auto Layout is actually built on top of this algorithm, and
-
0:40
is pretty good at solving the layout issues in an efficient and rapid manner.
-
0:44
Auto Layout was introduced in 2012 on iOS, and
-
0:48
is a constraint-based, descriptive layout system.
-
0:52
Much of this system is still based on the original premise of
-
0:55
the Cassowary Algorithm,
-
0:57
in that relationships between views can be expressed as linear equations.
-
1:03
Using Auto Layout, rather than specifying coordinate values, we can describe
-
1:08
the position of a view in relation to its superview or neighboring views.
-
1:13
We can say that we want a view or label to be centered horizontally in its superview.
-
1:19
And we want that label to be some distance away from the bottom of its superview.
-
1:25
In Cassaway, and as an extension, Auto Layout,
-
1:28
these relationships can be expressed as a series of linear equations.
-
1:33
For the first description, where we want the label to always be in the horizontal
-
1:38
center of the superview, we can write an equation that looks something like this.
-
1:42
label.centerX = superview.centerX.
-
1:48
And similarly for
-
1:49
the second description, we can define a linear equation that looks like this.
-
1:54
We can say label.bottom = superview.bottom- {padding}.
-
1:59
In Auto Layout, these descriptive linear equations are what we call constraints.
-
2:05
A constraint provides a fluent layout language that allows
-
2:09
us to define relationships between views in terms of linear equations.
-
2:14
While it might seem like there are many different ways to express these
-
2:18
relationships, they all boil down to a simple equation.
-
2:22
The As in this equation refer to view attributes.
-
2:27
What are attributes?
-
2:28
Don't worry, we'll get to that.
-
2:29
If we generically call a view an item, our equation looks like this.
-
2:34
Constraints are relationships described either between attributes on a view,
-
2:40
or between attributes on two different views.
-
2:44
So A1 can be an attribute on view 1, and A2 an attribute on view 2.
-
2:51
A2 can also be an attribute on view 1.
-
2:54
The M in this equation refers to a multiplier.
-
2:58
This allows us to modify the relationship by a certain amount.
-
3:02
The C refers to a constant value, and
-
3:05
is used to offset the equation by a certain amount.
-
3:09
Now, people often joke about the fact that the only thing you can change once
-
3:13
a constraint is created is this value that's called constant.
-
3:18
So this is essentially the basic premise or
-
3:21
building block underlying Auto Layout, a constraint equation.
You need to sign up for Treehouse in order to download course files.
Sign up