読者です 読者をやめる 読者になる 読者になる

プロトソリューション エンジニアブログ

プロトソリューションで開発しているWebサイト、iPhone、Androidアプリの開発情報などを発信していきます

Leap Motionで未来のUIを夢見る(Gesture取得編)

Unity Leap Motion

お久しぶりです。
プロトデータセンター新卒のIREIです。


今回はLeap Motionを使用します!

Kinectは全身のモーションをキャプチャするのに対して、
Leap Motionは手のモーションキャプチャに特化したデバイスとなります。

www.leapmotion.com



Leap Motionを使って最終的にはSAO(ソードアートオンライン)のようなUIの実現を目指したいと思います。
(手を下に降ろすとUI表示。上にあげるとUIを非表示的な)


本エントリーではまず、ジェスチャー(スワイプ)の認識を目標に設定。
では早速本題に参りましょう!


開発環境
iMac(OS X El Capitan ver. 10.11.6)
Unity(5.4)
Leap Motion(2.3.1)
LeapMotionCoreAssets_2_3_0.unitypackage





最新のCore Assetsを入れたらエラーが出たので、学生時代にお世話になった2.3.0バージョンを使用しました。
ダウンロードはこちら




ダウンロードしたらUnityのプロジェクトにインポートします。
インポートが完了すると「Assets」フォルダに「Gizmos」、「LeapMotion」、「LeapMotion+OVR」、「OVR」、「Plugins」のフォルダが新たに追加されます。
そしてこれから追加するコードをAssetsフォルダに直接置きたくないので、「Scripts」フォルダも作成しておいてそこにコードを格納します。
f:id:pdcokinawa:20160916173320p:plain



「Assets」 -> 「LeapMotion」 -> 「Prefabs」フォルダにあるHandControllerをHierarchyビューにドラッグ&ドロップで追加します。
HandControllerを追加するだけで手の表示が可能になります。
追加後にプレイボタンを押してLeap Motionの上に手をかざしてみて下さい。
下の図のように手が表示されると思います。
f:id:pdcokinawa:20160916173336p:plain




表示される領域はHandControllerの上方向に設定されています。
領域が白い線で表示されているのが確認できます。
この領域内にLeap Motionで取得した手のトラッキング情報をもとに、手が描画されます。
f:id:pdcokinawa:20160916175357p:plain

f:id:pdcokinawa:20160916175414p:plain



このPrefabにはHandController.csというスクリプトが備わっています。
このコードで使いたい手のモデルを指定できます。
デフォルトではCleanRobotLeftHandとCleanRobotRightHandが設定されていました。


ではこのHandControllerに手のジェスチャー(スワイプ)を認識するスクリプトを書いていきます。



以下がコードです。
Control_UI.cs

using UnityEngine;
using System.Collections;
using Leap;

public class Control_UI : MonoBehaviour {

	Controller controller;
	HandModel hand_model;

	void Start () {
		controller = new Controller ();
		// スワイプのジェスチャーを有効にする
		controller.EnableGesture (Gesture.GestureType.TYPESWIPE);
	}

	void Update () {

		Frame frame = controller.Frame ();
		GestureList leap_gestures = frame.Gestures ();

		for (int i = 0; i < leap_gestures.Count; i++) {
			
			Gesture gesture = leap_gestures [i];

			// ジェスチャーがスワイプだった場合
			if (gesture.Type == Gesture.GestureType.TYPESWIPE) {
				SwipeGesture Swipe = new SwipeGesture (gesture);
				// スワイプ方向
				Vector SwipeDirection = Swipe.Direction;
				// 0より小さかった場合
				if (SwipeDirection.y < 0) {
					// Downのログを表示
					Debug.Log ("Down");
				
				// 0より大きかった場合
				} else if (SwipeDirection.y > 0) {
					// Upのログを表示
					Debug.Log ("Up");
				}
			}
		}

	}
}


このスクリプトをHierarchyビューに配置したHandControllerにドラッグ&ドロップで追加します。
追加後にプレイボタンを押して実行すると、Leap Motionで検知した手が表示され、
f:id:pdcokinawa:20160916175911p:plain


手を下に降ろすと...
f:id:pdcokinawa:20160916180024p:plain

オワカリイタダケタダロウカ?
f:id:pdcokinawa:20160916180105p:plain


モウイチド(今度は上方向です)...
f:id:pdcokinawa:20160916180338p:plain


そいやッ!
f:id:pdcokinawa:20160916180401p:plain



Upというログが確認できました!
f:id:pdcokinawa:20160916180520p:plain



ジェスチャ(スワイプ)の取得に成功しました。
ちなみにスワイプ以外のジェスチャも取得できるので、お時間のある方は調べてみてください。(参考URLはこちら)

次回はジェスチャに対してボタンを表示、非表示をさせてみたいと思います。


ではでは!