Building apps for Apple Watch

28
Building Apps for WATCH Vikram Kriplaney

Transcript of Building apps for Apple Watch

Page 1: Building apps for Apple Watch

Building Apps for WATCH

Vikram Kriplaney

Page 2: Building apps for Apple Watch

ArchitectureWatchKit

WatchKit Extension

WatchKit App

Code +

Resources

Storyboard +

Resources

Page 3: Building apps for Apple Watch

WatchKit AppNavigation

Two Choices

Hierarchical Page-Based

Page 4: Building apps for Apple Watch

WatchKit Framework

• Like UIViewController

• Outlets

• Actions and targets

WKInterfaceController

Page 5: Building apps for Apple Watch

WatchKit FrameworkUI Elements

WKInterfaceLabel

WKInterfaceButton

WKInterfaceSwitch

WKInterfaceSlider

Page 6: Building apps for Apple Watch

WatchKit FrameworkUI Elements

WKInterfaceImage WKInterfaceSeparator WKInterfaceMap

Page 7: Building apps for Apple Watch

WatchKit FrameworkUI Elements

WKInterfaceTimer WKInterfaceDate

Page 8: Building apps for Apple Watch

Wot, no getters?let label = UILabel(…) label.setText(“Hello world”) label.getText()

By design, information is only sent over Bluetooth to the Watch.

Page 9: Building apps for Apple Watch

Wot, no text input?

[WKInterfaceController presentTextInputControllerWithSuggestions…

Page 10: Building apps for Apple Watch

WatchKit FrameworkUI Elements

• Layout

• Horizontal

• Vertical

• Margins & spacing

• Background

WKInterfaceGroup

Page 11: Building apps for Apple Watch

WatchKit FrameworkUI Elements

• Dynamic content

• Multiple row types

• Row Controller

• Selection handled by WKInterfaceController

WKInterfaceTable

Page 12: Building apps for Apple Watch

WatchKit FrameworkWKInterfaceTable

let entries = model.entries as [PhoneBookEntry]

table.setNumberOfRows(entries.count, withRowType: "ResultRow")

for (index, entry) in enumerate(entries) { if let row = table.rowControllerAtIndex(index) as? ResultRow { row.label.setText(entry.title) } }

Page 13: Building apps for Apple Watch

Demo-tai?

Page 14: Building apps for Apple Watch

WatchKit FrameworkApplication Lifecycle

Page 15: Building apps for Apple Watch

Application Lifecycle

WatchKit Framework

Page 16: Building apps for Apple Watch

Application Lifecycle

WatchKit Framework

Page 17: Building apps for Apple Watch

Application Lifecycle

WatchKit Framework

Page 18: Building apps for Apple Watch

Application Lifecycle

WatchKit Framework

Page 19: Building apps for Apple Watch

Application Lifecycle

WatchKit Framework

Page 20: Building apps for Apple Watch

Application Lifecycle

WatchKit Framework

Page 21: Building apps for Apple Watch

WatchKit FrameworkUI Elements

• Width & Height

• Size to Fit

• Relative to Container

• Fixed

• Alpha

• Hidden (“GONE”)

• Accessibility

Page 22: Building apps for Apple Watch

WatchKit FrameworkWKInterfaceDevice

• Device Information

• Screen Bounds

• Scale

• Content Size Preference

• Image Caching

Page 23: Building apps for Apple Watch

WatchKit AppGlances

• Template-based

• Tap launches Watch app

• Context

Page 24: Building apps for Apple Watch

WatchKit AppNotifications

Short Look Long Look

Page 25: Building apps for Apple Watch

WatchKit AppNotifications

• Local or Remote

• Category Types

• Customizable

Page 26: Building apps for Apple Watch

WatchKit AppAdvanced Topics

• Handoff API

• Animation with Images

• Image Cache

• Sharing Data

• Shared Frameworks

Page 27: Building apps for Apple Watch

Some Resources

• developer.apple.com/watchkit

• infinitapps.com/bezel

• www.watchkitresources.com

• Ray Wenderlich – WatchKit Tutorial with Swift: Getting Started

Page 28: Building apps for Apple Watch

Typography

• San Francisco Regular

• San Francisco Medium

• San Francisco Semibold

• San Francisco Bold

• San Francisco Heavy

• San Francisco Black

• San Francisco Light

• San Francisco Thin

• San Francisco Ultralight

Subtitle