Join Scott Gardner for an in-depth discussion in this video Layout margins and guides, part of iOS App Development: UI with Visual Tools.
- [Voiceover] I'm starting off in the project…that I've created a couple of auto layout…constraints in to set the width, height, and centering.…Constraints can also be used to position…views relative to any other view…sharing a common ancestor.…To see how this works, I'll show the utilities,…and drag another view from the Object…Library onto the canvas in the bottom right area,…and I'll be sure to add it as a sub-view of the main…view, not the blue view.…If the blue view becomes highlighted…and the background dimmed, that means…you would be adding the view as a sub-view…of the blue view.…
As long as the center of the view is outside…of the blue view, the view will be added…as a sub-view of the main view, not the blue view,…even if they overlap a bit.…In the Attributes Inspector, I'll set the background…color of the new view to salmon, and I'll…refer to this view as the red view going forward.…Now with the red view selected, I'll control-drag…to the right to its super-view.…I specify dragging to the right so that you…
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.