[iPhone] Glance を設定 (Apple Watch)

以前 Apple Watch の勉強会的なものに参加した時
Glance の重要性を説明されたのですが
なるほど、実際Apple Watchを使ってみると
Glance(チラ見)ではなく、アプリにとっては
「入り口」なんだと分かりました
 
実際、あの百々目鬼(どどめき)のようなTOP画面から
目的のアイコンを探してタップするのは、結構面倒です
多分、使う人は少ない
 
apple_watch_0
 
Glance はどういうところで使われるか
Watchはスリープが解除された場合
時計文字盤が表示
それから、下から上にスワイプすると現れるのがGlance
 
例えば 心拍計とやアクティビティが表示されるはずです
 
apple_watch_1
 
ここから左右にスワイプすると幾つかのGlanceが現れ
それをタップすると、そのアプリが起動するのです
 
アプリを使ってもらうには
ここでGlance登録されていることが重要です
 

watchOS 2.0
Swift 2.0
Xcode 7.0

 

Glance

 

Glance Project 作成

 
とりあえず、Glance を作ってみましょう
 
Project は通常のSwiftでプロジェクトを作成します
ここでは TestGlanceとTestGlanceWatchとして作成しています
 
これに Apple Watch を追加します
「File」->「New」->「Target」
 
スクリーンショット 2015-03-23 20.34.52
 
「watchOS」「Application」 の
WatchKit App を選択
 
スクリーンショット 2015-10-02 14.52.35

 
オプションを選んで「Finish」
ここで、「Include Glance Scene」にチェックを入れます
 
スクリーンショット 2015-06-04 13.56.31
Target に
TestGlanceWatch Extention
 GlanceController.swift
TestGlanceWatch
 Interface.Storyboard にGlanceのスクリーン
が追加されます
 

Interface.storyboard の設定

 
Interface.storyboard を選択して
「Glance Interface Controller」
を選ぶとこのようになっています
Main のアプリと違いレイアウトと
使える機能も限られています
Apple Watch Programing Guide: Glance
 
スクリーンショット 2015-06-04 14.33.40
 
Glance Interface Controller の Upper をクリックすると
幾つかのレイアウト候補が表示されます
 
スクリーンショット 2015-06-04 14.38.21
 
同様にLowerも選べます
この例では、defaultを使って、画像とテキストを入れたいと思います
 
スクリーンショット 2015-06-04 15.45.36
Main にアプリであることが分かるようにテキストを入れ
Glance の上にテキスト、その下に画像を入れます
画像はImages.xcassetsに入れたものが使えます
Apple Watch 画像表示
 

GlanceController.swift の設定

 
Glance ではできることは少ないのですが
コードでテキストの表示をさせることできます
 
尚、awakeWithContext ではGlanceインタフェースの初期化のために使いますが
アップデートしたい場合は willActivate にコードを書きます
実際に Glance の目的からするとアップデート情報の確認が主になるので
willActivate を使うケースが多いと思います
但し、初期化でここを使うのは推奨されていません
WKInterfaceController
 
GlanceController.swift

 
後は、storyboadのGlanceにあるlabelを紐づけすればできあがりです

 

Glance の実行

 
iPhone のマイウオッチ から
アプリを選択して

Simulator Screen Shot 2015.10.07 17.04.23
 
「グランスに表示」をONにします

Simulator Screen Shot 2015.10.07 17.04.32


 
これでWatchを起動して
Glance が表示され
それをタップして、アプリとなります

apple_watch_2
apple_watch_3

 

ページのトップへ戻る
 
sponsored link

シェアする

  • このエントリーをはてなブックマークに追加

フォローする