Get introduced to size classes and the need for them. Explore regular and compact size classes. Learn the general rules for device size classes.
- [Instructor] You've been working with three devices through this course, the iPad, the iPhone 8 Plus, and the iPhone X. I did that for a reason. Pull all three up and just to update them, I'm gonna throw in the menu item for all three of them. Now, you probably noticed I didn't have you run layouts on more than one device. There's a reason for that. Most of the examples will look horrible on other devices. So for example, the pizza here is an absolute disaster on the phones.
It might look a little bit better in iPhone 8 in landscape, but in general, you're finding that these are really didn't work really well together. It's font sizes, button sizes, or even different layouts for different devices. So how do you handle the multiple cases? UI kit has a way of dealing with this called size classes. And let me just pull one of these up here. Let's just do maki rolls for everybody. Size classes categorize devices by a horizontal and vertical measurement.
There are three cases. Compact, regular, and any. For over 30 different devices, you can break down into only nine possibilities. However, there's even some quicker rules which break this down into about three with one exceptional case. The iPhone like the iPhone X here in portrait is compact width and regular height. Most iPhones in landscape are compact width and compact height.
iPads are regular width and regular height no matter what. The exceptional case is the iPhone Plus. Here in portrait, you have the same thing as the iPhone X in portrait which is a compact width and regular height. But when you rotate it into landscape, it has a compact height, but a regular width just like the iPad. You decide how you want to treat this case.
Though most developers will make it act like an iPhone and here's why. Instead of worrying about two measurements, they only look at one. That way, you can classify all iPhones in portrait by their compact width and in landscape by their compact height and all iPads by a regular width. If you know the side classes, then you can change your layout to fit. Size classes are on both views and view controllers, so you have many opportunities to use them.
You get a description of every device as a class of traits. In this chapter, we'll use traits, which you've already learned about auto layout, and a few UI view controller methods to adjust the layout to look right in every case.
- When and why to use Auto Layout programmatically
- Creating constraints in Swift
- Resolving errors in Auto Layout
- Using the safe area
- Working with the Visual Format Language
- Adding a stack view
- Harnessing the power of inequalities and priorities in constraints
- Understanding traits and size classes
Skill Level Intermediate
Learning LayoutTest for iOS Developmentwith Kyle Sherman1h 43m Intermediate
Designing iOS and Android Appswith Renata Phillippi1h 6m Intermediate
1. Basic Concepts in Auto Layout
2. Coding Constraints
3. The Visual Format Language
4. Stack Views
5. Advanced Layout
6. Size Classes
Next steps1m 42s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.