本日は昨日に引き続きMRTKのExamples枠です。
MRTKでは機能のサンプルとしてExamplesのシーンでデモとして公開しています。
現在PressableButtonExamplesシーンを読み解いています。
その1ではUnityのプリミティブ3Dオブジェクト(Unity内で作成できる3Dモデル)のCubeを用いてゼロからボタンを作成する過程をみました。
その2ではPressableRoundButtonを見ました。
今回はPianoを読み解きます。
〇CustomButtonExamples
●Pianoの構成
[Piano]プレファブはMRTK/Examples/Demo/HandTracking/Prefabsにあるようです。
Pianoプレファブは、[DebugText][Velvet]と[C][D][E][F][G][A][B]の白鍵(白い鍵盤)と[CSharp][EFlat][FSharp][GSharp][BFlat]の黒鍵で構成されています。
このアルファベットとは音名を意味して日本でよく使われているイタリア名に直すと[ド][レ][ミ][ファ][ソ][ラ][シ]と[ド#][ミ♭][ファ#][ソ#][シ♭]に当たります。
つまり各音の鍵盤のオブジェクトを指します。
●鍵盤の中身
鍵盤にはコンポーネントが付いた親オブジェクトと[MovingKey]という名前の3Dオブジェクトの子オブジェクトで構成されます。
各親オブジェクトには[Interactable][BoxCollider][PressableButon][NearInteractionTouchable][AudioSource][DebutTextOutPut]がアタッチされています。
HandTrackingでユーザーの指先が鍵盤のBoxColliderに触れたときにPressableButtonとNearInteractionTouchableコンポーネントでタッチを検出し、touchの処理を実行すると同時にInteractableコンポーネントのイベントも発火させています。
PressableButtonでは[Moving Button Visuals]にMovingKeyを設定し、[PressSetings]で設定を行うことでボタンを押している指に合わせてキーが動くようになっています。
Eventsの[Touch Bigin()]ではボタンに触れた瞬間のイベントを指定します。
ここでボタン触れたとき[DebugText]に[TouchBegin]と表示されます。
[Touch End()]ではキーから手が離れたPress終了時のイベントを指定します。
TouchBeginと同様にTouchEndと表示されます。
[Touch Bigin()]はキーに指が触れた時発火するイベントです。[Button Pressed()]はキーに指が触れある程度キーが押し込まれたときに発火するイベントになります。
ここでは各キーに対応する音を流すこととButton Preesedと[DebugText]に表示される設定になっています。
[Button Released()]はPressedとEndの間、ボタンを押し終えて指をボタンから放している間に発火します。
ここでは他と同じく[DebugText]にButtonReleasedと表示されます。
まとめると
①ユーザーがボタンに触れると[Touch Bigin()]イベントが発動する
②ユーザーがボタンを押すと[Button Pressed()]イベントが発動する
③ユーザーがボタンを押すのをやめようとすると[Button Released()]イベントが発動する
④ユーザーが一連のボタンを押す動作を終えると[Touch End()]イベントが発動する。
●Interactableコンポーネントで状態によって見た目を変える。
Pianoプレファブではキーの色が変化しています。
これはInteractableコンポーネントのThemeで行っています。
Interactableコンポーネントの[Profiles]ではThemeが指定されており、そのターゲットとしてMovingKeyが指定されています。
ここでは状態によって色が変化するThameが使用されており、キーにカーソルが当たっている場合(Forcus)クリーム色に、キーが押されている場合(Pressed)水色に色が変化します。
InteractableコンポーネントがあることでAirTapを使用して遠隔でキーをたたくこともできます。 この場合PressedのOffsetのzで0.2が指定されていることでキーが外れたような挙動をします。
また、OnClick()でイベントが指定されていることもありこの場合も各キーに対応する音が鳴ります。
以上がPianoプレファブです。