8
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

株式会社リクルートテクノロジーズAdvent Calendar 2014

Day 8

Watchkit使ってみた

Last updated at Posted at 2014-12-08

#watchkit使ってみた

##はじめに

Apple公式リファレンスを読みました。また実際触りながら気づいた事をかきます。

##watchkitのアーキテクチャ

  • iPhoneがホストとなり、アプリの機能が全てiPhoneで実装されている。Apple Watchはviewとしての役割を担う。
  • Apple watchにはstoryBoardやリソースファイルだけがインストールされている
    • watch:view
  • iPhone側でWatchkit Extentionのプログラムが作動する。
  • Apple Watch のUIが操作されると、その情報はExtentionに伝わり、ロジックが走り、ExtentionsからwatchのUIを変更させる
  • 本体アプリとのデータ・コードの共有
    • コード:embbed frameworkとして切り出す必要がある。
    • データ:App Groupを使ってNSUserDefaultsを介する

スクリーンショット 2014-12-01 19.28.42.png

##3つのコンテンツ

###watch app

  • Apple Watchのホーム画面より遷移する(現在のシミュレータではホーム画面は確認できない)

####画面遷移は3パターン

  • Mordal
    • 左上にcancelボタン押すと画面が閉じる
    • 下から上にアニメーションしながら、画面遷移
    • 複数ページが作れる
      • 横スライドで画面切り替え

スクリーンショット 2014-12-01 19.30.45.png

  • Hierarchical
    • Navigation Controllerに近い
    • 階層型の画面遷移を行う

スクリーンショット 2014-12-01 19.36.50.png

  • Page-based
    • UIPageViewControllerに近い
    • 横スライドで画面の切り替え

スクリーンショット 2014-12-01 19.41.35.png

注意:Hierarchicalとpage-basedの併用はできない

###Glance

  • オプションの機能である(なくても良い)
  • 文字盤(待ち受け画面)上に向かってスワイプすると表示(現時点ではホーム画面がないからデバッグできない)
  • read-onlyである(ボタンはつけられない)
  • タップすると、watch appが起動
  • glanceはスクロールしない

スクリーンショット 2014-12-01 19.50.24.png

###notification

  • remoteNotification、localeNotificationに対応(localeNotificationはデバッグできなかった)
  • watch appを開くことなく、そのままアクションすることができる
  • ショートルックとロングルックがある
  • ショートルックはプライバシー情報が少ないものを扱う
  • ユーザが手首を下げると、ショートルックは消える。タップするとロングルックが表示される

スクリーンショット 2014-12-01 19.55.07.png

##できなかったこと

  • watch appでサウンドを出す事
  • watch appでtaptic Engineを使う事
  • watch appからiphone appを呼び出すこと、その逆も
  • watch appのバックグラウンドでの処理
  • 心拍センサーなどのセンサー
  • Digital Crown

##できたこと

  • ExtentionsでCoreLocationをつかうこと
  • Extentionsでフォースタッチ
  • ExtentionsでCoreData
  • Extentionsで外部APIをたたくこと
  • 外部APIからの返り値のNSData→UIImageへの変換表示

##UI Elements

  • Labels
    • プログラムで更新できる
    • フォントは組み込みの動的システムフォントを使う事を推奨している
    • カスタムフォントを使うとき、派手すぎないものを
  • images
    • @2xとして全てのアセットを作成
  • Groups
    • グループは他のオブジェクトのコンテナとして振る舞う
    • 背景色・背景画を設定できる
  • tables
    • スクロール可能
    • 20行までに押さえるべき
  • Buttons
    • ボタンの横幅全てを使う事を強く推奨
    • 角丸になっている
    • 背景かえれる(platterと呼ぶ)
  • Switchs
    • 必ずラベルを含む
  • Sliders
    • 水平な線と両端の画像で構成されている
  • Maps
    • mapは静的なスナップショット
    • ユーザインタラクションはない
    • ピンは3色
    • アノテーションは5つまで
    • タップするとマップアプリに飛ぶ
  • Date and Times
    • カウントダウン、カウントアップできる
  • Menus
    • force Touchで表示される
    • 1〜4のメニューが表示できる
    • 左上から右下に配置される
    • スクロールしない
    • 各アクションは画像とラベルを持つ必要がある。ラベルの行は2行まで

##アイコン

  • 基本、機能がiPhone appと似ている場合は、同じアイコンを使う
  • ユニバーサルイメージを利用する
  • pngを推奨

##制約

  • ジェスチャー

    • シングルタップ

    • スワイプ(水平、垂直、左端)

    • フォースタッチ

      	上記のみが許されている。
      	開発者がジェスチャーを付け足すことができない。
      	ピンチなどのマルチジェスチャーもサポートされていない	
      
  • 通信

    • watch appがアクティブな状態なときだけ、watchkit Extentionsは作動する
  • CoreLocationを使う事を推奨していない

参考

human interface guidelines

https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/WatchHumanInterfaceGuidelines/index.html

Watchkit programing guidelines

https://developer.apple.com/library/prerelease/ios/documentation/General/Conceptual/WatchKitProgrammingGuide/index.html

8
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?