Join Scott Gardner for an in-depth discussion in this video Resolve ambiguous layouts, part of iOS App Development: UI with Visual Tools.
- [Voiceover] I'm starting off in the project…I previously created with an ambiguous layout.…What has happened here is that I've pinned…the stack view to the leading and trailing edges…and now one of the labels has been horizontally stretched…beyond its intrinsic width.…I'll look at a couple of ways to resolve this.…First, I'll click the back button…to return to the document outline…and then I'll select the stack view.…In the Attributes Inspector, notice that…the distribution attribute is currently set to fill.…This causes the views contained within the stack view…to be stretched to fill, horizontally in this case,…across the width of the stack view.…
I can change that to either equal spacing…or equal centering here…and notice that the elongated label…changes back to its intrinsic width…and the warnings should disappear.…Sometimes they don't…and in this case, by selecting a different distribution,…such as equal centering,…it'll cause the warning to disappear.…I'll change the distribution back to fill…to see another way to resolve this.…
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.