apple watch and xamarin (nova mobile c# dev group 4/8/15)

17
CREATING APPLE WATCH EXPERIENCES WITH WATCHKIT AND XAMARIN ED SNIDER @edsnider NORTHERN VA MOBILE C# DEV GROUP APRIL 8, 2015

Upload: ed-snider

Post on 16-Jul-2015

79 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

CREATING APPLE WATCH EXPERIENCES

WITH WATCHKIT AND XAMARIN

ED SNIDER

@edsnider

NORTHERN VA MOBILE C# DEV GROUP – APRIL 8, 2015

Page 2: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

INTRO

I AM ED SNIDER

Senior Developer at InfernoRed Technology

Organizer of Northern VA Mobile C# Developers Group

Xamarin MVP

@edsnider

www.edsnider.net

Page 3: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

AGENDA

• Setup requirements

• The Apple Watch model

• WatchKit apps• Architecture

• Lifecycle

• Design

• Navigation

• Parent app

• Glances

• Notifications

• Apple Watch and WatchKit limitations

Page 4: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

SETUP REQUIREMENTS

• OSX Mavericks or Yosemite

• Xcode 6.2

• iOS 8.2 Simulators

• Xamarin.iOS 8.8

• Xamarin Studio 5.8 and/or Xamarin for Visual Studio 3.9

• Complete setup and installation instructions available at:

http://developer.xamarin.com/guides/ios/watch/installation/

Page 5: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

THE APPLE WATCH MODEL

Core Components of an Apple Watch app:

Parent / Containing iPhone App

WatchKit Extension

WatchKit App

Glance

Notifications

Apple Watch apps are bundled with (and require) an iPhone app – no 3rd party standalone

Page 6: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP ARCHITECTURE

WatchKit app • Lives on the Watch

• Contains UI elements only

WatchKit

app

WatchKit

extension

WatchKit app

+WatchKit extension

WatchKit extension • Lives on the iPhone

• Controls app interface

• Contains app logic

• Communicates with parent app

Parent iPhone

app

Page 7: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP ARCHITECTURE : INTERFACE OBJECTS

Watch app interfaces are manipulated and controlled via interface objects in the WatchKit extension controllers (WKInterfaceController)

Interface objects provide a proxy between the WatchKit extension and the actual views (aka controls) in the Apple Watch app

Setters only – you cannot get a view’s (aka control’s) attribute values at runtime

Automatically created (in *InterfaceController.designer.cs) based on the storyboard outlets and actions

Page 8: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP ARCHITECTURE : APP

LIFECYCLE

Awake(NSObject context)

4. WKInterfaceController Lifecycle

WillActivate()

1. Launch App

2. Load scene from Storyboard

3. Create WKInterfaceController

Page 9: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP DESIGN : USER EXPERIENCE

Controls:

• Label, Button, Switch, Slider, Separator, Image, Map

• prefixed with WKInterface

Layout:

• Group

• Table – similar to a ListView; provides row selection handling (DidSelectRow())

Text Input:

• Pre-defined phrases

• Dictation

• Emoji

Page 10: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP DESIGN : SCREEN SIZES

136 x 170

pixels

156 x 195

pixels38mm 42mm

Page 11: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP DESIGN : CONTEXT MENUS

Each interface controller can have its own context menu

Display up to 4 menu items (each with a title and image)

Activated by user with “Force Touch”

Page 12: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP NAVIGATION

Page based navigation

• User navigates by swiping left and right through a “carousel” of pages

• Dot indicator shows current page

Hierarchical navigation

• User navigates by clicking through pages

• Pages are pushed on and popped off a navigation stack

Page 13: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

WATCHKIT APP : WORKING WITH PARENT APP

• Use OpenParentApplication() to offload long running / background tasks to the parent iPhone app

• Use app groups to share data between the WatchKit extension and the parent iPhone

Page 14: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

GLANCES

A Glance is part of the WatchKit app and WatchKit extension

The Glance’s interface is contained within the WatchKit app’s storyboard and has its own special interface controller

Only one glance interface per WatchKit app

Same life cycle as WatchKit apps’ standard interface

Use timer to update the Glance’s interface and keep its data relevant

Page 15: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

NOTIFICATIONS

Apple Watch displays notifications based on its parent iOS app’s notification settings

By default, nothing is required to support notifications on Apple Watch apps, including actionable notifications

Two interfaces - Short-look interface, then Long-look interface if the user continues to look at it

Apple Watch notifications can be customized (long-look interface only)

Page 16: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

LIMITATIONS

• Watch apps require a parent iPhone app to be present

• Cannot dynamically add UI elements at runtime

Page 17: Apple Watch and Xamarin (NoVA Mobile C# Dev Group 4/8/15)

RESOURCES

• XAMARIN WATCHKIT DOCUMENTATION: http://developer.xamarin.com/guides/ios/watch/

• DEMO CODE: http://www.github.com/edsnider

Apple Watch frames: http://infinitapps.com/bezel/

iPhone frames: http://mockuphone.com/