Version 2 of the presentation from Twin Cities Code Camp #19 http://www.twincitiescodecamp.com

1. Tom Soderling
Senior Mobile Developer
Zebra Technologies
@tomsoderling
Apple Watch
Development with
Xamarin Watch Kit

2. 1. Reasons for Apple Watch
2. Day to Day Experience
3. Cool Features
4. New Types of User Interactions
5. Overview of UI Elements
6. Anatomy of a Watch Kit Solution
7. Application Lifecycle
8. Your First Watch App
9. Working with the Parent App
10. Cautionary Tales
11. Answers to Common Questions
O U T L I N E

3. W H Y ?
F I R S T T H I N G S F I R S T

4. W H A T C A N A P P L E WA T C H D O
T H A T M Y P H O N E C A N ' T ?

5. W H A T C A N A P P L E WA T C H D O
T H A T M Y P H O N E C A N ' T ?
• Monitor heart rate

6. 1 . R E A S O N S F O R A P P L E WA T C H

7. 1 . R E A S O N S F O R A P P L E WA T C H
1. Smartphone as a brain or hub for connected devices

8. 1 . R E A S O N S F O R A P P L E WA T C H
1. Smartphone as a brain or hub for connected devices
2. Some interactions are way better/easier on the watch
• The temperature outside, next calendar event, prioritization
• General principle. ex: Laptop vs. Tablet vs. Phone

9. 1 . R E A S O N S F O R A P P L E WA T C H
1. Smartphone as a brain or hub for connected devices
2. Some interactions are way better/easier on the watch
• The temperature outside, next calendar event, prioritization
• General principle. ex: Laptop vs. Tablet vs. Phone
3. Apple’s Reason
“Your phone is ruining your life. Many of us are subject to the tyranny of the
buzz—the constant checking, the long list of nagging notification. People
want that level of engagement, but how do we provide it in a way that’s a little
more human, a little more in the moment when you’re with somebody?”
http://www.wired.com/2015/04/the-apple-watch/

10. • Great for texting using Siri
• Not usually brave enough to use when other people are within earshot
• Handsfree Siri: great for reminders, shopping list, setting timer &
conversions when cooking, simple questions
• Great for when I’m working on the car, or want my phone to be safe/dry
• Handy for controlling music playing through phone or connected speakers
• Extremely waterproof
• More than sufficient battery life for a day
• Dick Tracy-style phone calls! Speakerphone is especially good for boring
phone conference calls
• Listening to voicemails
2 . D A Y T O D A Y E X P E R I E N C E

11. Demo
Activity
Remote Viewfinder
Quick Contacts
Apple Pay
3 . C O O L F E A T U R E S

12. • Suggesting how long someone should use your app
• Lightweight, quick, brief interactions; a few seconds
• 4 New User Interactions
1. Normal interaction (Watch App)
2. Glance
3. Notification
4. Complication
4 . N E W T Y P E S O F U S E R I N T E R A C T I O N S

13. 1. Normal Interaction
• Don’t simply port phone app over to watch
• We’ll look at the controls available
4 . N E W T Y P E S O F U S E R I N T E R A C T I O N S

14. 2. Glance
• Non-actionable, single view of information
• Swipe up from bottom of watch face to view collection of them
4 . N E W T Y P E S O F U S E R I N T E R A C T I O N S

15. 3. Notification
• Actionable
• 2 views: based on interaction, will transition from Short Look to Long Look
4 . N E W T Y P E S O F U S E R I N T E R A C T I O N S
Short Look Short Look Long LookShort Look

16. 4 . N E W T Y P E S O F U S E R I N T E R A C T I O N S
4. Complication
• Small elements on the watch face and provide quick access to frequently
used data

17. 4. Complication
• Small elements on the watch face that provide quick access to frequently
used data
4 . N E W T Y P E S O F U S E R I N T E R A C T I O N S

18. 5 . O V E R V I E W O F U I E L E M E N T S

19. 5 . O V E R V I E W O F U I E L E M E N T S

20. 5 . O V E R V I E W O F U I E L E M E N T S

21. 5 . O V E R V I E W O F U I E L E M E N T S

22. 5 . O V E R V I E W O F U I E L E M E N T S

23. 5 . O V E R V I E W O F U I E L E M E N T S

24. 5 . O V E R V I E W O F U I E L E M E N T S

25. 5 . O V E R V I E W O F U I E L E M E N T S

26. • Important note: With watchOS 1 apps, your Apple Watch is just an
external display for a program running on a connected iPhone
• Watch apps are made possible through use of the new iOS 8 Extensions
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N

27. ClockKit Framework Reference
Contacts Framework Reference
Core Data Framework Reference
Core Foundation Framework Reference
Core Graphics Framework Reference
Core Location Framework Reference
Core Motion Framework Reference
EventKit Framework Reference
Foundation Framework Reference
HealthKit Framework Reference
HomeKit Framework Reference
Image I/O Reference Collection
MapKit Framework Reference
Mobile Core Services Framework Reference
PassKit Framework Reference
Security Framework Reference
Watch Connectivity Framework Reference
WatchKit Framework Reference
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N
• WatchOS 2, released on Sept 21st
• Ability for apps to run on the Apple Watch
directly/natively
• Access sensor data: heart rate, accelerometer
• Use the Taptic Engine, Digital Crown, speaker,
microphone
• 3rd party watch complications
• Tetherless WiFi communication
• Siri can do more
• 18 additional frameworks to use when building
for watchOS 2

28. • Extension Points
Share Edit Photo Watch AppToday
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N

29. • How they all work together
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N
watchOS 1

30. watchOS 1
• App Communication
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N

31. watchOS 1
• App Communication
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N

32. • App Architecture
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N
watchOS 1

33. • App Architecture
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N
watchOS 1

34. • App Architecture
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N
watchOS 1

35. • App Architecture
6 . A N A T O M Y O F A WA T C H K I T S O L U T I O N
watchOS 1
watchOS 2

36. 1.
The lifecycle of a WKInterfaceController object
1. Awake()
2. WillActivate()
3. DidDeactivate()
1
2
3
7 . A P P L I C A T I O N L I F E C Y C L E

37. • Don’t forget to add your Watch to member center!
• Think about Provisioning ahead of time
• 3 different App/Bundle IDs (same prefix)
1. com.something.MyPhoneApp
2. com.something.WatchKitApp
3. com.something.WatchKitExtension
• 2 Provisioning options:
1. Single Wildcard App ID: com.something.*
• Fewer Application Services: no App Groups, Push Notifications, HomeKit
2. Three Explicit App IDs
8 . Y O U R F I R S T WA T C H A P P

38. • Xamarin’s watchOS 2 support is in Preview only
• 1st Preview: Sept 7th
• 2nd Preview: Oct 1st
• Note: “previews are very early, unsupported builds” for Xamarin to
“gather feedback and bug reports”
• Watch Apps work on Simulator only
• Xamarin’s Challenge:
• WatchOS 2 requires pure LLVM BitCode, that is, BitCode that does not
contain any machine code blobs. iOS supports mixed mode BitCode,
that is, BitCode that contains both the LLVM intermediate representation
code, and blobs of machine code.
8 . Y O U R F I R S T WA T C H A P P

39. • Time for Add > New Project!
8 . Y O U R F I R S T WA T C H A P P

40. • Choose project and UI Interactions (Scenes)
8 . Y O U R F I R S T WA T C H A P P

41. • This will add 2 new projects to your solution
8 . Y O U R F I R S T WA T C H A P P

42. • The main storyboard is in the WatchKit App project
8 . Y O U R F I R S T WA T C H A P P

43. Interfaces in the Watch App storyboard
1. Normal Interaction (App)
2. Glance
3. Notification 1
2
3
Short Look
Long Look
8 . Y O U R F I R S T WA T C H A P P

44. Interface Controllers
1. Normal Interaction (App)
2. Glance
3. Notification
4. Complication
8 . Y O U R F I R S T WA T C H A P P
1
2
3
4

45. 9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P

46. Demo
How Deep Is It?
9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P

47. 4 Options
1. Run Code on iPhone (watchOS 1)
• In the Watch App Extension
WKInterfaceController.OpenParentApplication()
• Implement this method in the iOS AppDelegate
HandleWatchKitExtensionRequest()
• Opens the iPhone app in the background
Short Look Long Look
9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P

48. 4 Options
2. Shared Storage with App Groups
• Allows iOS 8 extensions to share data with parent app.
• App Groups are set up in the Apple Developer Member Center
• You can stash you watch app settings values, or files
• Doesn’t open iPhone app in the background
9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P

49. 4 Options
2. Shared Storage with App Groups
9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P
// ViewController.cs - Place value in shared storage
NSUserDefaults shared = new NSUserDefaults(“group.com.[something].WatchGroup", NSUserDefaultsType.SuiteName);
shared.SetString(distanceValue, “distance”);
shared.Synchronize();
// InterfaceController.cs - Retrieve value from shared storage
NSUserDefaults shared = new NSUserDefaults(“group.com.[something].WatchGroup", NSUserDefaultsType.SuiteName);
shared.Synchronize();
var value = shared.StringForKey(“distance”);

50. 4 Options
3. Message Passing
• Darwin Notification Center allows for communication between iOS
apps and extensions
• API of the Core Foundation framework
• WormHoleSharp supports these notifications
• C# port of open source project MMWormHole
• Allows you to listen for and subscribe to these messages
9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P

51. 4 Options
3. Message Passing
// ViewController.cs - Sending into WormHole
var wormHole = new Wormhole("group.com.tomsoderling.WatchGroup", “messagesDir");
wormHole.PassMessage("distance", distanceValue);
// InterfaceController.cs - Receiving through WormHole
var wormHole = new Wormhole("group.com.tomsoderling.WatchGroup", "messagesDir");
wormHole.ListenForMessage<string>("distance", (message) =>
{
Distance = message;
distanceLabel.SetText(Distance);
});
9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P

52. 4 Options
4. Watch Connectivity Framework (watchOS 2)
• Apps use this framework to pass files and data back and forth
• Most transfers happen in the background when the receiving app is
inactive. When the app wakes up, it is notified of any data that
arrived while it was inactive
• Can also do live communication when both apps are active
WCSession.ActivateSession()
WCSession.SendMessage()
WCSession.TransferFile()
9 . W O R K I N G W I T H T H E PA R E N T P H O N E A P P

53. Error: AMDeviceSecureInstallApplicationBundle returned: 0xe8003ffe
Answer: Can no longer add Apple Watch projects to a cross-platform app (ala Xamarin.Forms)
Error: "Failed to install" "Invalid Bundle - No Apple Watch Binary”
Answer: Just reboot the watch!
Error: The Watch App 'WatchApp' does not have a valid UIDeviceFamily value. Expected 'Watch (4)'
found 'IPhone, Watch (5)'.
Answer: Clean and re-build solution
Error: “Incompatible target framework (Xamarin.WatchOS)” for WatchApp reference in iOS Project
Answer: Recreate iOS project using the Xamarin Studio preview, version 5.10
1 0 . C A U T I O N A RY TA L E S

54. Q: I want make sure that notifications for my current iOS app appear on the Apple
Watch, what do I have to do?
A: Nothing - provided your app supports notifications. If your phone is set to
receive that notification, you can choose to mirror it on your Watch via its
notification settings.
Q: Can I build a stand alone Watch App?
A: No. A WatchKit app requires an existing iOS app
1 1 . A N S W E R S T O C O M M O N Q U E S T I O N S

55. Great Article on creating the Apple Watch
Watch Kit: Getting Started (watchOS 1)
Xamarin Sample Watch Kit Apps
WatchOS 2 video from WWDC 2015
Xamarin watchOS 2 Preview #2
LLVM BitCode Challenge: Miguel’s Blog
Passing messages with WormHoleSharp
Apple Watch HIG
Bezel
1 2 . R E S O U R C E S A N D L I N K S
http://www.wired.com/2015/04/the-apple-watch/
http://developer.xamarin.com/guides/ios/watch/
https://developer.xamarin.com/samples/ios/Watch/
https://developer.apple.com/videos/wwdc/2015/?id=105
http://forums.xamarin.com/discussion/52477
http://tirania.org/blog//index.html
https://github.com/Clancey/WormHoleSharp
https://developer.apple.com/watch/human-interface-guidelines/
http://infinitapps.com/bezel/
@TomSoderling