Glance(グランス):
チラッと見る機能と言われていますが、私なりの解釈ではサブメニューページとしての機能だとおもっています。アプリのトップメニュー(小さなアイコン固まり)から上にスワイプするとGlance(グランス)が表示されます。アプリ登録されているGlance(グランス)をタップするとアプリ画面が表示されます。サブメニューと言った方が理解しやすと思いますね。
今回紹介するのがこれです。
Apple Watchアプリが持っている重要な情報をチラッと見せるための機能です。
Apple Watchアプリを作るにあたり実装は必須ではなく、必要なら実装すれば良い機能です。
Xcode 6.2 以上
https://developer.apple.com/xcode/downloads/
6.2からAppleWatch開発環境(watchkit)が入っています。
iOS8.2以上 (iPhone)
8.2にバージョンアップするとアプリ「Apple Watch」が追加されるのですぐわかります。
iPhoneアプリケーション プロジェクトを生成
xcode起動後、「Create a new Xcode project」を選択します。
次にiOS -> Application -> Single View Applicationを選択します。
プロダクト名をWatchKitGlanceObjとします。
Watch Kit Appを追加
Watch Kitを追加します。File -> New -> Target を選択します。
AppleWatch ->WatchKit Appを選択します。
Include Glance、Include Notification Scene は、チェックを入れます。
Finishiをクリックします。
Activateをクリックします。
Interface.storyboardにInterface、Glance(ぱっと見る)、Notification(通知)が配置されています。
※Interface、Notification(通知)という機能がありますが今回は使用しません。
Interface.storyboard上のGlance(ぱっと見る)について見ていきます。
Glance用の画面の方には、二つのGroupが予め設定されており、このGroup内に収まるようにUIを配置していきます。Groupeよりはみ出して配置をすることはできません。
Glance Interface Controller には、Upper(上部)とLower(下部)と表記されています。
Glance Interface Controller Upper(上部) のグループをクリックするとUpper(上部)上に設定する複数の選択できるレイアウトが表示されます。
今回は、LabelとGroup付きのレイアウトを選択します。
Upper(上部)が選択したレイアウトに変更されます。
Glance Interface Controller Lower(下部) のグループをクリックします。Upper(上部)と同じようにLower(下部)上に設定する複数の選択できるレイアウトが表示されます。
今回は、1つのGroupレイアウトを選択します。
Glance Interface Controller Upper(上部)Lower(下部) のレイアウトが完成しました。
Upper(上部)には、文字とLower(下部)には画像を設定していきます。
その前にGlance Interface Controller Lower(下部)に設定する画像を用意します。
WatchKit Appの Images.xcassetsにLower(下部)に貼り付ける画像をドラックします。
Apple Watch内に保持されて表示されると思います。
※注意
WatchKit AppのImages.xcassetsでないと画像は表示されませんので注意してください。
Upper(上部)の文字の設定を行います。
Label Text に「花火一覧」を入力します。
Labelの下のGroupにはLabelを配置します。
Groupに配置したLabelに「Watch notepad」と入力します。
Glance Interface Controller Lower(下部)Groupの設定を行います。
Lower(下部)Groupには画像を貼り付けますのでBackgroundから保存している花火の画像(WatchKit AppのImages.xcassets)「img01」をプルダウン選択します。ModeをプルダウンメニューからAspect Fitを選択します。
Aspect Fit:画像のaspect比を維持し、ちょうどはいるようにします。
これで、Glance(グランス)の設定は完了です。
それでは、実際にシミレーションで確認してみましょう。
Glance - WatchKitGlanceObj WatchKit App を選択しiPhoneを選択しビルド実行します。
ビルド実行したシミレーションです。
チラッと見る機能 Glance(グランス)がこのように表示されます。
※注意
Glanceの画面ではユーザーは操作をすることは出来ません。
GlanceのstoryboardにButtonやSwitchを配置してビルドをすると、ビルドエラーとなります。
Glanceで許可される操作は
・Glance画面でタップ→WatchAppへ遷移
・Glance画面で横にスワイプ→別のアプリのGlanceに切り替え
のこの2つのみのようです。
GitHub WatchKitGlanceObj
▫️参考にしたページ
【WatchKit】Glanceの情報によってWKInterfaceをかえる
Apple Watchで初めて登場した新UI「Glance」について
WatchKit:視線の最初の概要 ナターシャロボット
コメントをお書きください