本日はMRTKのExamplesシーンの勉強枠です。
最近UIを取り組んでいることもありボタンのサンプルが並ぶPressableButtonExampleを見ていきます。
〇ゼロから作るボタン
PressableButtonExampleにはHoloLens 2用に[How to make a button from scratch?]と題してボタンの作り方が紹介されています。
●基本的なボタン(Basic Pressable Button (Near only))
①UnityのPrimitive3DObjectの[Cube]を作成し、[PressableButton.cs]と[NearInteractionTouchable.cs]をアタッチします。
2つのコンポーネントをアタッチすることでオブジェクトをtouchした時にアクションが起こるようになります。
②MRTKStandardシェーダを使用したHoverLightをつける。
[PressableButtonCube]のマテリアルに[MRTKStandardShader]をアタッチしています。
マテリアルのpropertyから[HoverLight]のチェックボックスにチェックを入れることでカーソルが当たると明るくなります。
③オーディオをアタッチする
[PressableButtonCube]に[AudioSource]をアタッチします。
[PressableButton.cs]の[Events],[Button Pressed()]と[Button Released()]にイベントを追加して自身の[AudioSource]をアタッチし[PlayOneShot]で[MRTK_Select_Main]を実行するように設定しています。
これでボタンをtouchした時、音が鳴るようになりました。
④Interactableのテーマで視覚的を行う。
[Interactable]コンポーネントをアタッチします。
[Interactable]コンポーネントの[Profiles]の[Target]に自分自身をアタッチします。これはthemeの実行対象を指します。
行う[Theme]をアタッチします。
ここでは[Scale Offset Color Theme]が使用されています。 これはターゲットオブジェクトの状態によって色や大きさを変化させるthemeです。
・default
デフォルト状態での色と大きさを指定します。
・Forcus
カーソルが当たっているときの色と大きさを指定します。
・Pressed
オブジェクトに触れているときの色と大きさを指定します。
・Disabled
オブジェクトの状態が不明な時の色と大きさを指定します。
⑤PhysicalPressを使用して、InteractableのOnClickイベントを近距離と遠距離の両方で使用できるようにします。
最後にPhysicalPressコンポーネントをアタッチします。
InteractableコンポーネントのEvent、OnClick()でボタンの選択時のアクションが指定できますが、AirTapのみ対応している状態になります。
PhysicalPressコンポーネントをアタッチすることでボタンをHoloLens2のHandTrackingでタッチすることでもイベントが発火するようになります。
PhysicalPressコンポーネントの[Routhing Target]に自身のInteractableコンポーネントを使用することでAirTapでの遠隔の選択動作とHandTrackingの近距離での選択動作が紐づきます。
以上がUnityのプリミティブ3DオブジェクトのCubeからボタンを作る流れになります。