https://www.apple.com/jp/watch/features/
ついに最近、デベロッパー向けにwatchkitが発表されました。
AppleWatchアプリのチュートリアルで、
今回は絵文字を拡大表示させるサンプルをやります。
以下、簡素化した20のステップ。
ソースはこちらです。
https://gist.github.com/manchan/1e9cfae322f87583a2f7
- 新規プロジェクトのシングルページアプリケーションで作成。言語はswift
- プロジェクトパネル、General > Targets > Add Targetにより、iOS > Apple Watch > Watch Appを選択
- Watchkit extensionとWatch appが追加される
- watchのデフォルトの画面をシミュレーターで確認する際は、「~Watch App」にターゲットを変更。デバイスはなんでもよい。
- ビルド実行でシミュレータが立ち上がるが、無視。
- シミュレータメニューのHardware > External Displays > Apple Watch - 38mm またはApple Watch - 42mmを選択し、再度ビルド実行、watch画面が立ち上がり確認可能。
- はじめにInterface.storyboardのInterface Controller Sceneにて, tableを追加、table内にlabelを追加
- tableをInterfaceController.swiftにnameをtableとしてoutlet接続
- 新規ファイルを追加より、EmojiRow.swiftを追加
- Interface.storyboard, Interface Controller SceneにてtableのクラスをEmojiRowに設定
- table内のlabelをEmojiRow.swiftにemojiRowLabelとしてoutlet接続
- ここまででtableのラベルの内容を定義してforループを回せば同じ内容が表示される。
詳細はInterfaceController.swiftを確認 - tableの要素をひとつ押した際に、詳細の画面に遷移させたいので、
新規ファイル,ZoomEmojiController.swiftを追加する。 - Storyboardにて、新規画面の追加をする、右サイドパネルよりInterface Controllerを追加する
- ClassをZoomEmojiControllerとし、ModuleはEmojiWatch_WatchKit_Extensionとする
- IdentifierをZoomEmojiControllerとする, これによりtableのひとつの要素を押した際に遷移するcontrollerの識別が可能となる。
- labelをふたつ追加し、それぞれ、zoomEmojiLabel、definitionLabelをZoomEmojiController.swiftにoutlet接続する
- tableの一要素押下の処理をdidSelectRowAtIndexより指定、
詳細はInterfaceController.swiftを確認 - ZoomEmojiController.swiftのコンストラクターメソッド内にて、
contextを受け取り、fontサイズなどを指定後、それぞれのlabelに代入する。 - ビルドして実行、シミュレーターにて、配列に定義した絵文字が拡大表示、テキストが表示されていればOK
Finish!
Apple Watch Tutorial - Learn How to Make a Simple Apple Watch App
http://vimeo.com/112249657上記動画を参考にしています。
以下ソースです。
次回はglanceやnotificationのサンプルを作りたいと思います。
AppleWatchのお仕事お待ちしております！