#Getting Started with Apple's WatchKit
###Introduction This is the first post about how we built Whiskr, the Apple Watch to see pictures of cats taken close to you. The aim is to demonstrate more of the trickier features of WatchKit and help people get their own Apple Watch apps launched. This first post is about how to get started, what tools you need and how to set up your project.
###1. XCode and WatchKit
Make sure you have XCode 6.2 which comes with the WatchKit SDK, available at https://developer.apple.com/xcode/downloads/
It's also worth taking the time to check out the following guides:
###2. Create a new Project
Start by creating a new iPhone app. There's not much point including iPad as the Apple Watch currently can only communicate with an iPhone. Follow through the prompts to create a normal iPhone app - we'll get to adding the Watch bit next.
###3. Adding an Apple Watch Target
Next we need to add the Apple Watch target, to do this click on the project settings (top blue icon in the left navigation). This should show a list of targets, and a list of project settings. At the bottom of the targets there is a tiny + button. Click this plus button and select Apple Watch on the left menu and select an Apple Watch App.
You will additionally have to fill out some information for your Apple Watch app - the thing not to miss here is below the language selection, decide if you want to include "glances" and "notifications". You can always add these in later if you forget, but it helps to think about what your going to be using.
###4. Folders Added
After you have added an Apple Watch App a bunch more folders get added into your project:
- a) is where all the code related to your iPhone app gets kept, including all controllers and the storyboard.
- b) is where all your WatchKit code and controllers get stored.
- c) is where you can edit the Watch storyboard and any images needed.
###5. WatchKit Interface Builder
When you first go into the Interface Builder for your Watch App you'll notice you have several screens already created for you, with 3 separate main entry points, this is for each of the types of things your app can do: the app instance, glances, and two types of notifications. If you haven't read our introduction to what you can do with the Apple Watch read it here to find out what these things actually are.
To get started, I dragged out a label onto my app instance screen. Now the properties of UI elements in WatchKit have changed a lot from the iPhone/iPad properties. One of the biggest differences is that you cannot just simply drag items where you want them to go on the screen.
I set my label to go right in the middle of my screen so to do that I first need to change the Position to be horizontal and vertically center. Secondly I need to change the Size height and width to fit content. The alternative here is to be relative to container which is very much like Android's Match Parent. Alternatively, you can provide a specific fixed height or width.
###6. Running
Now we're ready to test our app with the emulator. To do this you need to find the control where you select which device to run on (needs to be iPhone 5 or above). You also need to click the bit to the left of the emulator device, this usually is your app name and logo, and change it to run the Watch App instead. Now when you click play, it should show an iPhone 5 emulator and a square Watch 42mm emulator with your app running on it. If your app does't seem to run, sometimes you have to run the iPhone app first, and then re-run the Watch app.
###Conclusion
Now we've got the beginnings of our very own Apple Watch app, next we're going to look at how to add multiple row types into a table.