Learn about programmatic auto layout for use in live views. Learn why it is a useful technique.
- [Instructor] This layout works fine in Xcode, but it doesn't look so well in iPads. I mentioned earlier that the live view on and iPad is the size of the iPad. On an iPad Mini and a 9.7 inch iPad, that's 768 by 1024. On iPad Pro, 12.9 inch, that's a resolution of 1024 by 1366. If you're showing a one device only, you can use the frames to set up your view. If you might be using several devices, consider Auto Layout. Auto Layout is a huge topic all to itself, and I'm not going to dive too deep into all you can do with Auto Layout.
Let me give you a short introduction to get you started. I set up this layout as a project in Xcode so I can show you Interface Builder for a minute and introduced Auto Layout a little bit easier. There's a copy of this file in the downloads folder. I added the pizza image in the text view. The frames that we work with give an absolute position of a view. Auto Layout, instead, talks about relations between views. You need to give Auto Layout enough information to find an origin and a size of a view, but that is in relation to other objects.
I could switch this view to an iPad 12.9 in landscape, and it still fits. Going back to the iPhone in portrait, of the Xcode playground, open up the constraints folder in the document outline. Look at the third constraint. It says that the trailing edge or right side of the pizza image is equal to the trailing side of the view.
All my trailing edges are like this one. On the other hand, the text view is 20 points in from the left of the edge. The top of the text view extends over the image by 40 points. These offsets are called constants in Auto Layout. Now look at the height of the image. It is 0.3 times, or 30% the height of the view.
The 0.3 is called the multiplier. Knowing these relations, we can set Auto Layout to keep everything sized correctly in any playground.
- Comparing iPad and Xcode playgrounds
- Creating and testing Swift classes and code in iPad and Xcode playgrounds
- Prototyping code
- Debugging and testing with Quick Look live views
- Using markup to interactively document code and create educational lessons
- Compiling code into playground books