目次
TL;DR
Mixed Reality Toolkit Documentation の UX Building Blocks の章の Button から要点と補足をまとめたページです。
検証環境
- Unity：2019.2.7f2
- MRTK：2.3.0 / 2.4.0
- VisualStudio：2019
- Device：HoloLens2
内容
ドキュメントは2.4をベースに書かれている。
詳細はこちら。
microsoft.github.io
非公式日本語はこちら。 hololabinc.github.io
How to use pressable buttons
2D(uGUI)向け
基本的な使い方は以下の通り。
MRTK Canvas に変換する
[NearInteractionTouchableUnityUI]コンポーネントを追加
Scale を 0.001 に
Unity UI 向けのボタンを追加する
- UnityUIInteractableButton.prefab
- PressableButtonUnityUI.prefab
- PressableButtonUnityUICircular.prefab
- PressableButtonHoloLens2UnityUI.prefab
3D
基本的な使い方は以下の通り。
- コライダーベースのボタンをシーンに追加する
テキストとアイコンを変更する（2.4であればButtonConfigHelper）
Interactable スクリプト（2.4であればButtonConfigHelper）で
- Events の OnClick() に呼び出し先を登録する
General の Speech Command で音声コマンドを選び、ラベルを修正する
音声コマンドはMixedRealityToolkitのプロファイルで登録されているものから選ぶことになる
音声コマンドを無効化するには、音声コマンドを[No Selection]にして、ラベルを無効化すればいけそう？（未確認）
Inspector properties
PressableButtonHoloLens2 ボタンに登録されているコンポーネント。
- PressableButtonHoloLens2 は、MRTKのボタンを構成する最もベースの動きを提供する
- PhysicalPressEventRouter は、PressableButton のイベントを Interactable にルーティングする
- Interactable は、ユーザー操作に対する動きや他のスクリプトとのインターフェスを担う
- NearInteractionTouchable は、コライダーを持つオブジェクトをユーザーが触れるようになる
- ButtonConfigHelper は、テキストとアイコン、OnClick イベントのハンドリングがここでできるようになっている（2.4のみ）
各スクリプトの関連はYoonさんのセッション動画のスライドが分かりやすかった。 *1
OnClick に関しては PhysicalPressEventRouter で発火のタイミングを選択できる。
Interactable の Receivers には Press や Touch も選べるので、詳細を変更しようとしない限りは直接 PressableButtonHoloLens2 を触らなくても良さそう。
Near Interaction、Far Interaction の両方の動きをサポートするには Interactable の OnClick を使う必要がある。
Toggle では、Interactable の General に項目が追加される。Receviers では Toggle を選べる。
こちらもセッション動画のスライド。
How to change the icon and text
2.4なら ButtonConfigHelper から編集できる。
アイコンは[Icon Set]というアイコンをグループ化したセットで管理するようだ。
Examples パッケージには以下のセットが含まれている。
2.3ならこのあたりで直接編集する。
Creating a HoloLens Icon Font Asset
C:/Windows/Fonts/holomdl2.ttf をUnityにインポートする。Explorer上だとこんな表示。
初回作成時は、[Select Font Asset]は空のままで良さそう。
Character Sequence (Hex) の値。
E700-E702,E706,E70D-E70E,E710-E714,E718,E71A,E71D-E71E,E720,E722,E728,E72A-E72E,E736,E738,E73F,E74A-E74B,E74D,E74F-E752,E760-E761,E765,E767-E769,E76B-E76C,E770,E772,E774,E777,E779-E77B,E782-E783,E785-E786,E799,E7A9-E7AB,E7AF-E7B1,E7B4,E7C8,E7E8-E7E9,E7FC,E80F,E821,E83F,E850-E859,E872-E874,E894-E895,E8A7,E8B2,E8B7,E8B9,E8D5,E8EC,E8FB,E909,E91B,E92C,E942,E95B,E992-E995,E9E9-E9EA,EA37,EA40,EA4A,EA55,EA96,EB51-EB52,EB65,EB9D-EBB5,EBCB-EBCC,EBCF-EBD3,EC03,EC19,EC3F,EC7A,EC8E-EC98,ECA2,ECD8-ECDA,ECE0,ECE7-ECEB,ED17,EE93,EFA9,F114-F120,F132,F181,F183-F186
ちょっと古いがこの辺の記事を見ると理解が進む。
Generateが完了したら任意の場所に保存。187個もあるらしい。
Projectウィンドウでメニューから[Create > Mixed Reality Toolkit > Icon Set]で新しいアセットを作成する。
[Char Icon Font] に作成した Font Asset を突っ込むと読み込まれる。
Available Icons でクリックすると下の Selected Icons に追加される。逆に Selected Icons でクリックすると消える。
Selected Icons に追加されているアイコンが ButtonConfigHelper で選択できるようになる。
Name をつけるとスクリプト上からアイコンを識別できる。
Icon Set を変更して任意のアイコンを選択する。
