読者です 読者をやめる 読者になる 読者になる

ObjecTips

基本Objective-Cで iOS とか OS X とか

Apple Watch Programming Guide まとめ その3

WatchKit ドキュメントまとめ

これの続き

Apple Watch Programming Guide: Developing for Apple Watch

2015-03-09 初出バージョンのドキュメントまとめ(網羅ではなく適宜省略)

Glances

Glance Essentials

グランス

  • アプリの重要な情報を表示する補助的なもの。全てのアプリにとってグランスが必要ではない
  • グランスのインターフェースは WatchKit App 内の Storyboard ファイルにあって、カスタムされた WKInterfaceController によって管理される
  • ユーザ操作には対応せず、タップすると WatchKit App が起動する
The Glance Life Cycle

グランスのライフサイクル

  • グランスの表示ライフサイクルは Interface Controller を素早く表示するために早いタイミングで初期化される点を除いて他の Interface Controller と同じ
Glance Interface Guidelines

グランスのUIガイドライン

  • 情報を素早く伝えるようにする事。テキストをずらずらと表示したりしない
  • 最も重要なデータにフォーカスする事。Glance は WatchKit App の置き換えではなく WatchKit App の一部
  • グランスの画面にはボタン、スイッチ、スライダー、メニューといったインタラクティブなものを置かない
  • グランスにテーブルや Map を置かない。禁止されてはいないが限られた領域にテーブルや Map を置くのは良くない
  • 表示する情報はタイムリーにする事
  • 全てのテキストはシステムフォントを使用する事。グランスでフォントをカスタマイズする場合、テキストをレンダリングして画像として表示する
  • グランスはアプリにつき1つの Interface Controller しか表示できないので適切な情報を表示できるようにする

Managing Your Glance Interface

グランスのUIの管理

  • ランタイムでグランスのコンテンツを設定するには WKInterfaceController のサブクラスを使う
Adding a Glance Interface to Your App

アプリへのグランスの追加

  • プロジェクトで WKInterfaceController のサブクラスを作り WatchKit Extension に追加する
  • Storyboard で Glance Interface Controller をドラッグして追加してクラスを設定する
  • Storyboard に複数の Glance Interface Controller を追加してはいけない(Storyboard でエラーが起こる)
Implementing and Updating a Glance Interface Controller

グランスの実装と更新について

  • initawakeWithContext: メソッドで初期化してラベルや画像に初期値を設定する
  • willActivate メソッドでスクリーンに表示される前に適宜グランスの画面を更新する
  • スクリーン表示された後は NSTimer を使って画面を更新する。WKInterfaceDateWKInterfaceTime は自動的に更新されるので更新する必要はない
Customizing App Launch from Your Glance

グランスからのアプリの起動のカスタマイズ

  • Glance から WatchKit App が起動される時、通常はメインの Interface Controller が表示される
  • initwillActivate は通常通り実装する
  • updateUserActivity:userInfo:webpageURL: メソッドを呼んで userInfo を介してアプリに情報を渡す
  • アプリ側では起動時にメインの Interface Controller で handleUserActivity: メソッドが呼ばれるので、userInfo を使ってUIを設定する
  • 例えばページベースのアプリなら、初期状態で表示するページを userInfo によって選択する

Notifications

Notification Essentials

通知

  • iOSアプリが通知をサポートしていれば WatchKit App は何もしなくてもシステム提供のUIによって通知の表示が出来るが、カスタマイズする事もできる
The Short-Look Interface

ショートルック

  • ショートルックはスクロール不可でカスタマイズも不可
  • ローカル通知の場合 UILocalNotificationalertTitle プロパティで表示する文字列を設定できる
  • リモート通知の場合は payload の alert の辞書内に title キーを追加する
The Long-Look Interface

ロングルック

  • スクロール可能
  • カスタマイズしない場合システム提供のアプリのアイコン、通知の文字列、アラートのメッセージを含むUIが表示される
  • ロングロックは3つの領域に分かれる。まずアプリのアイコンと名前を含む帯。帯の色は変更可能。次に通知の詳細情報を含むコンテンツ領域。そして dismiss ボタンと他のアクションボタンを含む領域
  • アプリアイコンをタップすると WatchKit App が起動する
  • アクションボタンをタップすると iOSアプリか WatchKit App にアクションが送信される。フォアグラウンドのアクションは WatchKit App と Extension に配信され、バックグランドのアクションはiOSアプリに配信される(通知設定のAPIUIUserNotificationActivationModeForegroundUIUserNotificationActivationModeBackground がある)
  • dismiss ボタンは何もせずに通知を閉じる
  • その他の領域はタップしても何も起こらない
Adding Action Buttons to Notifications

通知へのアクションボタンの追加

  • iOS 8での UIUserNotificationSettings を設定する。カテゴリも設定する
  • WatchKit Extension ではなくiOSアプリ側に通知のコードを書く
Responding to Taps in Action Buttons

アクションボタンタップ時の挙動

  • アクションがタップされた時 UIUserNotificationAction オブジェクトでどのようなアクションを行うかを決める
  • アクションはフォアグラウンドとバックグランドで、また認証有りと無しとで動作する
  • フォアグラウンドのアクションは WatchKit App を起動してメインの Interface Controller の handleActionWithIdentifier:forRemoteNotification:handleActionWithIdentifier:forLocalNotification: メソッドを呼ぶ
  • バックグランドのアクションはiOSアプリをバックグラウンドで起動して application:handleActionWithIdentifier:forRemoteNotification:completionHandler: application:handleActionWithIdentifier:forLocalNotification:completionHandler: メソッドを呼ぶ
  • フォアグラウンドのアクションでは WKUserNotificationInterfaceController のサブクラスはアクションを処理せずに、メインの Interface Controller が処理するという事が重要

Managing a Custom Long Look Interface

ロングルックのカスタマイズ

  • ロングルックのカスタムUIは静的UIと動的UIの2つのUIから成る
  • 静的UIは必須でデザイン時にUIを構成する。動的UIはオプションで通知内容を表示をカスタマイズできる
  • Storyboard に通知の Interface Controller を追加した時はデフォルトでは静的で、Has Dynamic Interface を設定して動的UIの Interface Controller を作成する
  • 通知が来ると WatchKit が適切な Interface を表示する。動的UIが無かったり動的UIを表示する十分な電力が無い場合は自動的に静的UIを表示する
  • 読み込み処理は通知の payload が処理される点以外は他の Interface Controller と同じ
Adding a Custom Notification Interface to Your App

アプリへのカスタム通知UIの追加

  • プロジェクトに WKUserNotificationInterfaceController のサブクラスを作成して WatchKit Extension のターゲットに追加
  • Has Dynamic Interface の attribute をオンにして表示された dynamic notification interface controller にクラスを設定する
  • WatchKit は設定されたカテゴリ名を使うが、一致するカテゴリ名が無ければ default というカテゴリ名を設定されたシーンを呼び出す
Configuring the Category of a Custom Interface

カスタムUIのカテゴリの設定

  • payload に category キーが入っている。入っていなければ default というカテゴリ名が使われる
  • Storyboard 上のカテゴリ設定で通知の帯とタイトルの色も設定できる
  • リモート通知の場合は aps キーの辞書の中に category キーを設定する。ローカル通知の場合は UILocalNotificationcategory プロパティに設定する
Configuring a Static Notification Interface

静的な通知UIの設定

  • 画像は全て WatchKit App のバンドル内になければならない
  • 画面にはテーブル、Map、その他のインタラクティブなUI要素を含んではならない
  • Interface Controller の notificationAlertLabel プロパティは IBOutlet でラベルオブジェクトに接続しなければならない。ラベルには通知のアラートメッセージが表示される。その他の全てのラベルは静的で変更される事は無い
Configuring the Dynamic Notification Interface

動的な通知UIの設定

  • WKUserNotificationInterfaceController のサブクラスを作る
Designing Your Dynamic Interface

動的UIをデザインする

  • 通知がタップされるとアプリが起動するのでインタラクティブなコントロールは含まない
  • ラベル、画像、グループ、セパレータが主
  • テーブル、Map は必要であれば置く
  • ボタン、スイッチ、その他のインタラクティブなコントロールは含まない
Configuring Your Dynamic Interface at Runtime

ランタイムでの動的UIの設定

  • 通知が来たら WatchKit は対応する WKUserNotificationInterfaceController のサブクラスをインスタンス化してdidReceiveRemoteNotification:withCompletion: または didReceiveLocalNotification:withCompletion: メソッドを呼んで payload を渡す。コントローラ側は payload から Interface を準備して、completion ハンドラブロックで準備の完了を WatchKit に伝える
  • 処理に時間がかかると Apple Watch は動的UIを破棄して静的UIを表示する
  • completion ハンドラを呼ぶ際に、WKUserNotificationInterfaceTypeDefault を渡せば動的UIの表示をキャンセルして静的UIを表示する事ができる
  • 通知画面はシステムフォントのみをサポートするので、カスタムフォントを使用したい場合はテキストをレンダリングして画像として表示する
Testing Your Custom Interface

カスタムUIのテスト

  • 動的UIをシミュレータでテストするには通知 Interface を起動するスキーム設定を作成して、テストに使用するJSONデータを指定する(WatchKit App 作成時のオプションで Include Notification Scene オプションをオンにしていれば Xcode が自動で設定してくれる)

終わり