Join Scott Gardner for an in-depth discussion in this video Slide Over and Split View, part of iOS App Development: UI with Visual Tools.
- Earlier in this chapter,…I showed that newer model iPads…offer slide over and split views,…allowing two apps to run…on the same screen at the same time…In approximately one third or two thirds…or one half screen width dimensions.…These widths correlate to compact…or regular width size classes.…Continuing in the same project…that uses size classes to create user interfaces…that adapt to different screen sizes…and screen orientations.…Let's see how to use size classes…to handle being displayed…in a slide over or a split view.…I'll select compact width, any height…from the size class selector,…and change the width constraint constant…of the blue view to 50 in the size inspector.…
And now I'll select regular width, any height…and change the blue views width to 150.…I'll build and run on an iPad…and I'll rotate to landscape.…Notice that the blue view is wider.…150 points, to be specific…because the width size class is regular.…But if I activate slide over…by dragging from the right edge,…and if you get an app selector,…
Here iOS app architect Scott Gardner explains how to create designable views and dynamic and adaptive user interfaces for any screen size or orientation. He shows how to work with stack views, images, custom fonts, and Interface Builder's Auto Layout tools, which speed up your design process and help adhere to Apple's interface guidelines. Along the way, he provides best practices for designing interfaces that are clean, efficient, and enjoyable for users.
- Creating and customizing views
- Laying out a user interface
- Working with dynamic Auto Layout designs
- Stacking views
- Creating an adaptive layout
- Handling orientation changes
- Working with images
- Customizing fonts
Skill Level Intermediate
Sketch: Mobile Design Workflowswith Diane Cronenwett1h 30m Intermediate
1. Designable User Interfaces
2. Dynamic User Interfaces
3. Adaptive User Interfaces
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
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.