MRが楽しい

MRやVRについて学習したことを書き残す

EventTriggerを用いてマウスのクリックとhololensのタップを検出する

本日は hololens の技術調査枠です。
EventTrigger コンポーネントと HoloToolKit を用いてマウスのクリックと hololens のタップを検出します。
これを用いると簡易に、Unity上のデバッグでタップ時の動作を確認しつつ、開発を行うことができます。

手順について一からまとめたものを記録します。
新規プロジェクトを作成し、HoloToolKitをインポートします。
f:id:bluebirdofoz:20170924030426j:plain

インポートできました。いつもの hololens アプリの設定反映を行います。
今回の処理では Capability の追加設定は不要です。
f:id:bluebirdofoz:20170924030531j:plain

Hierarchy 上で右クリック UI -> EventSystem で EventSystem オブジェクトを作成します。
f:id:bluebirdofoz:20170924030543j:plain

EventSystem オブジェクトに以下のコンポーネントを追加でアタッチします。
・Holo Lens Input
・Holo Lens Input Module
f:id:bluebirdofoz:20170924030551j:plain

MainCamera に PhysicsRaycaster コンポーネントを追加します。
f:id:bluebirdofoz:20170924031816j:plain

環境の準備は完了です。
後はイベントをキャッチして動作するオブジェクトとスクリプトを何でも良いので作成します。
今回はタップ操作を行うと、サイズが大きくなる Sphere を作成します。

タップ対象となるオブジェクトとして Sphere オブジェクトを適当な位置に追加します。
f:id:bluebirdofoz:20170924030603j:plain

Sphere オブジェクトに EventTrigger コンポーネントをアタッチします。
f:id:bluebirdofoz:20170924030612j:plain

AddNewEventType をクリックして、PointerClick を選択します。
f:id:bluebirdofoz:20170924030623j:plain

PointerClick セクションが追加されるので、「+」ボタンをクリックします。
f:id:bluebirdofoz:20170924030633j:plain

以下のように PointerClick のイベントが追加されました。
f:id:bluebirdofoz:20170924030648j:plain

呼び出すイベント関数を設定する必要がありますので、TapEvent.cs スクリプトを作成します。
f:id:bluebirdofoz:20170924030715j:plain

TapEvent.cs スクリプトには以下のように、タップ時に呼び出されるイベント関数を定義します。
・TapEvent.cs

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class TapEvent : MonoBehaviour {
  public void OnClickTapEvent()
  {
    // アタッチされているオブジェクトのサイズを 0.1f 拡大する
    this.transform.localScale = this.transform.localScale + new Vector3(0.1f, 0.1f, 0.1f);
    // クリックログ
    Debug.Log("OnClick");
  } 
}

作成した TapEvent スクリプトを Sphere オブジェクトにアタッチします。
f:id:bluebirdofoz:20170924030728j:plain

登録したイベント関数を EventTrigger に設定します。
まずオブジェクト欄横の「◎」ボタンをクリックして SelectObject ウィンドウを表示します。
プロジェクト内のオブジェクト一覧が表示されるので、TapEvent スクリプトをアタッチした Sphere オブジェクトを設定します。
f:id:bluebirdofoz:20170924030738j:plain

するとファンクション欄の選択肢に、Sqhere オブジェクトにアタッチしたコンポーネント一覧が表示されます。
TapEvent スクリプトを選ぶと、作成した OnClickTapEvent 関数が表示されますので、これを選択します。
f:id:bluebirdofoz:20170924030747j:plain

以上でオブジェクトとイベントの設定も完了です。
Unity での再生ボタンをクリックしてプロジェクトを実行してみます。
f:id:bluebirdofoz:20170924031511j:plain

ゲームビュー内で Sphere オブジェクトをクリックすると……。
f:id:bluebirdofoz:20170924030821j:plain
TapEvent.OnClickTapEvent 関数が呼び出され、Sphere オブジェクトが拡大されてログ出力が行われました。

さて、次は hololens 上での確認です。
そのまま File -> BuildSettings から BuildSettings ウィンドウを開いてビルドします。
f:id:bluebirdofoz:20170924030831j:plain

hololens にインストールして実行すると、Sphere オブジェクトが表示されます。
f:id:bluebirdofoz:20170924030843j:plain

Sphere オブジェクトを視界中央に捉えた状態で、タップ動作を行うと……。
f:id:bluebirdofoz:20170924030853j:plain
イベント関数が呼び出され、Sphere オブジェクトが拡大されました。成功です。

この手法を用いると、hololens 上でのタップ操作時のデバッグが Unity 上で簡易に行えます。
どんなアプリでも利用する操作なのでまとめておきます。

因みに、このプロジェクトのままだと hololens アプリ利用時には何処にカーソルしているかが分かり辛いです。
カーソル表示などと組み合わせると、より実用性が増すと思います。
bluebirdofoz.hatenablog.com
(今回の場合、衝突判定先の Sphere オブジェクトのレイヤは UI ではないので注意)