Now, while we've been building our apps thus far, some of you might have already noticed that when you 1
rotate the apps or when you try to run the app on a different screen size, often our beautiful designs 2
gets completely corrupted, and they look terrible when in landscape or when run on different devices. 3
So even though our Dicee app works perfectly, when we try to rotate it, bits of it gets completely cut 4
off, and we can no longer really interact with our app properly. So we can't really upload our app as 5
it is that the App Store. 6
We, first, have to learn about the rules that we can put into place in order to make it look great on 7
all orientations and screen sizes. 8
And these rules allow the iPhone to figure out how to layout each element as it gets rendered on a different 9
screen of a different aspect ratio or size. 10
So for example, if we have three buttons: a blue one, a red one, and a green one, then we could tell the 11
blue button that whenever it gets laid out on screen, it always has to be 10 pixels from the top and 12
10 pixels from the left. 13
So it's pin to the left corner. 14
And when we have our red button, we're going to tell it to be centered in the app, so vertically and horizontally 15
in the middle. 16
And finally, for the green button, It's going to be centered only in the vertical axis, 17
so this one., and it's gonna be pin 10 pixels from the bottom. 18
So by implementing these various rules, we can tell each of our User Interface Elements how it should 19
be displayed even when the size of the phone changes or when the aspect ratio of the screen changes. 20
So in this module, we're going to be doing a full exploration of all things to do with Auto Layout, 21
the rules that enable our User Interface Elements to know how they should be laid out. And in the process, 22
we're going to learn about size classes and how to define those in the Xcode Interface Builder, as well 23
as understanding the rules or the Constraints that we can set to specify how components should be laid 24
out on the screen. And then we're gonna learn about how to use Alignment and Pinning and a combination of 25
these to design how our app should look in landscape and in portrait. And then we're going to learn about 26
how to use Containers, so views that can wrap other views to get more fine grained control over what 27
things should look like. 28
And finally, we're gonna learn about something called StackVews to stack our components vertically 29
and horizontally on the screen. 30
There's a lot to learn in this module. 31
And once you're ready, head over to the course resources where you'll get a link to the AutoLayout- 32
iOS13 starting repository on GitHub, and then go ahead and clone it to your local system. 33
And once you've done that, head over to the next lesson and we'll get started straight away.