getting started with developing for the apple watch

39
Getting Started with Developing for the Apple Watch Murtza Manzur, Developer Evangelist at InMobi

Upload: murtza-manzur

Post on 28-Jul-2015

935 views

Category:

Software


0 download

TRANSCRIPT

Page 1: Getting Started with Developing for the Apple Watch

Getting Started with Developing for the Apple Watch

Murtza Manzur, Developer Evangelist at InMobi

Page 2: Getting Started with Developing for the Apple Watch

About InMobi

● Largest independent mobile ad network● 1B monthly uniques● Products: Native Ads, Video Ads, App Install Platform

Page 3: Getting Started with Developing for the Apple Watch

MASSIVE REACH ACROSS TOP COMPANIES

Page 4: Getting Started with Developing for the Apple Watch

Agenda

● Apple Watch architecture● Hello World app for the Apple Watch ● Counter app for the Apple Watch● Communicating from the Apple Watch to the iOS App

Page 5: Getting Started with Developing for the Apple Watch

Architecture

● Apple Watch app requires an iOS app● WatchKit apps have two parts○ A WatchKit extension that runs on iPhone ○ A set of user interface resources that are installed on

Apple Watch. ● Glance○ Supplemental way for the user to view important

information from your app

Page 6: Getting Started with Developing for the Apple Watch

Architecture

● When Apple Watch app is launched, WatchKit extension on iPhone runs in the background ○ Updates UI and responds to user interactions

● Watch App○ Storyboard and resource files

● WatchKit Extension○ Code associated with the Watch App is executed here

Page 7: Getting Started with Developing for the Apple Watch

Architecture

Page 8: Getting Started with Developing for the Apple Watch

Hello World App for the Apple Watch

● Let’s build a Hello Word app

Page 9: Getting Started with Developing for the Apple Watch

Hello World App - Step 1

Click Create a new Xcode Project.

Page 10: Getting Started with Developing for the Apple Watch

Hello World App - Step 2

Select Single View Application, and then click Next.

Page 11: Getting Started with Developing for the Apple Watch

Hello World App - Step 3

Enter values for Product Name and Organization Name. Select Objective-C as Language and iPhone as Devices. Leave Use Core Data unchecked.

Page 12: Getting Started with Developing for the Apple Watch

Hello World App - Step 4

Select a directory to save the project in, and then click Create.

Page 13: Getting Started with Developing for the Apple Watch

Hello World App - Step 5

Select File, New, then click on Target.

Page 14: Getting Started with Developing for the Apple Watch

Hello World App - Step 6

Select Apple Watch in the left-hand menu. Then click Next.

Page 15: Getting Started with Developing for the Apple Watch

Hello World App - Step 7

Uncheck Notification Scene and Glance Scene. Then click Finish.

Page 16: Getting Started with Developing for the Apple Watch

Hello World App - Step 8

Click Activate.

Page 17: Getting Started with Developing for the Apple Watch

Hello World App - Step 9

In the left-hand menu, select the Interface.storyboard file from the WatchKit App folder.

Page 18: Getting Started with Developing for the Apple Watch

Hello World App - Step 10

This is the Interface Builder for Apple Watch. In the next step, we will drag a Label object from the Object Library to the Apple Watch interface.

Page 19: Getting Started with Developing for the Apple Watch

Interface Controller

● Like a View Controller in iOS● Support two navigation styles, which are mutually exclusive○ Hierarchal○ Paged based

● Interface navigation through segues or programmatically○ To implement a modal in your storyboard file, create a

modal segue.○ To implement a modal programmatically, call the

presentControllerWithName:context: method

Page 20: Getting Started with Developing for the Apple Watch

Interface Controller

● awakeWithContext○ System calls this method at initialization time to provide

the interface controller with any relevant contextual data from a previous interface controller

● willActivate○ System calls this method to notify the interface controller

that its content is about to be displayed onscreen● didDeactivate○ System calls this method to notify the interface controller

that it is no longer onscreen

Page 21: Getting Started with Developing for the Apple Watch

Hello World App - Step 10

Search for the Label object in the Object Library (lower right-hand menu in Xcode). Then drag the Label Object to the Apple Watch interface.

Page 22: Getting Started with Developing for the Apple Watch

Interface Objects

● Arrange themselves● Two unique view objects to

Watch App○ Date○ Timer

● Can be embedded in vertical or horizontal groups

Page 23: Getting Started with Developing for the Apple Watch

Hello World App - Step 11

Double click on the Label object you added to the Apple Watch interface, and change the text to Hello World.

Page 24: Getting Started with Developing for the Apple Watch

Hello World App - Step 11

Click the run icon in Xcode. This will build your app, and then run it in a simulator.

Page 25: Getting Started with Developing for the Apple Watch

Hello World App - Step 12

To enable the Apple Watch simulator, select Hardware, External Displays and then click on Apple Watch - 42mm.

Page 26: Getting Started with Developing for the Apple Watch

Hello World App - Step 13

Simulator will show Hello World.

Page 27: Getting Started with Developing for the Apple Watch

Counter App for the Apple Watch

● Let’s build a counter app for the Apple Watch

Page 28: Getting Started with Developing for the Apple Watch

Counter App - Step 1

Navigate back to Interface.storyboard. Double click the label text to change it from Hello World to 0. Add two Button objects from the Object Library. Rename the button text: one for “+”, and a second for “-”.

Page 29: Getting Started with Developing for the Apple Watch

Counter App - Step 2

Navigate to the InterfaceController.m file in the WatchKit Extension folder. As shown in the screenshot above, add two properties between @interface and @end.

Page 30: Getting Started with Developing for the Apple Watch

Counter App - Step 3

In @implementation, add two methods to increment and decrement the counter property. We will connect these two methods with the button objects in the Interface Builder.

Page 31: Getting Started with Developing for the Apple Watch

Counter App - Step 4

In @implementation, add a third method to set the text of the counter label in the interface to value of the counter property. We will connect the counter label property to the counter label object in the interface in a later step.

Page 32: Getting Started with Developing for the Apple Watch

Counter App - Step 5

Connect the decrementCounter action to the “-” button object. Connect the incrementCounter action to the “+” button object.

Page 33: Getting Started with Developing for the Apple Watch

Counter App - Step 6

Connect the counterLabel property from the Interface Controller to the counter label object in the interface.

Page 34: Getting Started with Developing for the Apple Watch

Counter App - Step 7

Click the run icon in Xcode.

Page 35: Getting Started with Developing for the Apple Watch

Counter App - Step 8

The Watch App will run in the simulator. If the “+” and “-” buttons are working correctly, they will increment and decrement the counter.

Page 36: Getting Started with Developing for the Apple Watch

Communicating from Watch to iOS App

● Use openParentApplication method to send data from WatchKit extension to iOS app■ Passed as a dictionary object

● handleWatchKitExtensionRequest method to receive data on iOS app

● Reference○ https://developer.apple.

com/library/prerelease/ios/documentation/WatchKit/Reference/WKInterfaceController_class/index.html

Page 38: Getting Started with Developing for the Apple Watch

Resources

● Tips for Submitting Apple Watch App○ http://www.fiveminutewatchkit.com/blog/2015/4/2/submitting-

your-watchkit-app● Bezel, a tool to simulate the look of an Apple Watch

Page 39: Getting Started with Developing for the Apple Watch

Murtza ManzurDeveloper [email protected]

Questions?