Join Scott Gardner for an in-depth discussion in this video Design UI with stack views, part of iOS UI Development with Visual Tools.
- View Offline
- [Voiceover] I'm starting off in the project…with a single stack view that embeds a label…and a text field.…I can now take the same approach to layout…an entire user interface using stack views.…I'll repeat the steps I took with the first name label…and text field pair on the remaining label text field pairs…minus setting the width, and you'll see why shortly.…I'll select each label and text field pair,…embed them in a stack view,…and then set the stack view's spacing to eight.…Now I'll select all four stack views,…and click the stack tool to embed them in a stack view.…
Depending on how you had positioned these stack views…before embedding them in a stack view,…the alignment setting of the enclosing stack view…maybe leading or center.…What I want is trailing,…so that the text fields will align nicely to the right,…so I'll change the alignment for the stack view…in the attributes inspector to trailing.…I'll also give the spacing a value of eight.…Now I'll select the stack view that I just created…and the image view, and select the stack tool button again…
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