Learn how to align objects on the watch both vertically and horizontally, and learn about how stacking behavior and alignment work together.
- [Narrator] Object alignment for watchOS…is very different than iOS.…Xcode for watchOS avoids all the complications…of auto-layout's constraints…by giving you only a few options,…much like the stack view in iOS.…There are only three ways to align horizontally,…and three ways to align vertically.…Horizontally, you can align any object to the left,…the center, or the right.…Vertically, you can align zones…for the top, the center, and the bottom.…You set these using the Alignment Attributes…on the storyboard.…
There are no properties to control them.…Let's lay out the current interface…to make more sense than it does now.…Select Choose Dinner.…You'll see in the Attribute Inspector,…the alignment is Horizontal Left,…and Vertical Top.…Click on the drop-down for horizontal alignment.…The storyboard shows the three options of…Left, Center, and Right.…Change to Center.…The label centers.…Select Strawberry.…Set horizontal alignment for Strawberry to Right.…
It moved to the right.…While you'll notice there's an option to…storyboard attributes for Left, Center, and Right text…
Author
Steven Lipton
Released
11/30/2017- Principles of watchOS development
- Adding buttons and labels to your app
- Connecting objects to code
- Testing a watchOS app
- Laying out WatchKit UI objects
- Adding navigation
- Using Interface Library elements such as inputs, pickers, and media players
- Creating tables
- Working with table data
Skill Level Intermediate
Duration
Views
-
Introduction
-
Welcome1m 4s
-
-
1. A Look at the Apple Watch App
-
Parts of a watch app2m 22s
-
Evolution of the watchOS2m 57s
-
-
2. Building Your First Apple Watch App
-
Starting with Xcode2m 56s
-
Add buttons2m 4s
-
Add labels2m 33s
-
Connect objects to code3m 39s
-
Write watchOS code2m 27s
-
Prepare the simulator4m 18s
-
Run your watchOS app1m 51s
-
-
3. Working with UI in watchOS
-
Align WatchKit objects3m 11s
-
Size Watchkit objects2m 53s
-
Add groups3m 23s
-
Add images5m 10s
-
Scale images3m
-
4. Navigation
-
Add more controllers5m 58s
-
Scroll with pages5m 6s
-
Navigate with hierarchy5m 36s
-
Contexts in code6m 35s
-
Context in segues4m 23s
-
Modals5m 28s
-
-
5. Interface Library
-
Text inputs5m 6s
-
Pickers6m 17s
-
Images in pickers4m 9s
-
Digital crown6m 3s
-
Haptics7m 23s
-
Add movie player5m 40s
-
In-line movie player6m 15s
-
Audio player6m 10s
-
-
6. Tables and Scrolling
-
Understand watch tables1m 2s
-
Single-row tables6m 49s
-
Selecting data4m 27s
-
Table navigation7m 19s
-
Pagination4m 49s
-
-
Conclusion
-
Next steps1m 57s
-
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press 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.
Share this video
Embed this video
Video: Align WatchKit objects