2018.08.22 KumaMCN ガチ本
前回まで
• 実機なしでHoloLensアプリ開発やーる(導入、ウンコ投げ)
• https://www.slideshare.net/satoshibfujimoto/20180613-vol4
• 実機なしでHoloToolkit-Unity全部やーる
• https://www.slideshare.net/satoshibfujimoto/20180801-vol7
実機なしで
お絵描きつくーる
~実機は持ってる人から奪え~
開発環境
• Unity 2017.2.2p2
• https://unity3d.com/jp/unity/qa/patch-releases/2017.2.2p2
• Windows Store .NET Scripting Backendにチェック
• HoloToolkit-Unity-2017.4.0.0.unitypackage
• HoloToolkit-Unity-Examples-2017.4.0.0.unitypackage
• https://github.com/Microsoft/MixedRealityToolkit-Unity/releases
-> 2017.4.1.0もあるよ
• Visual Studio 2017 (15.7.6)
• ユニバーサルWindowsプラットフォーム開発, Unityによるゲーム開発に
チェック
• Windows 10 SDK (10.0.17134.0)
• Windows 10 April 2018 Update
参考文献
• HoloLensハンズオン:ハンドトラッキング&音声入力編
• https://www.slideshare.net/ssuserc0d7fb/hololens-76412075
• HoloLensでお絵描きする
• https://qiita.com/miyatama/items/06e2b01cbdf4661bc81d
Unityを起動
設定
MRTKのインポート
いつもの設定
Main CameraをDelete
以下のPrefabをProjectから検索し
HierarchyへD&D
- MixedRealityCameraParent
- DefaultCursor
- InputManager
MixedRealityCameraParent->
MixedRealityCameraの設定
丸いぽっちをクリックして
FakeSpatialMappingMesh
をアタッチ
ProjectからSpatial Mappingを検索し、
HierarchyへD&D
Spatial Perceptionにチェック
プレイボタンで実行!
こまめにシーンを保存(Ctrl+S)
Cubeの作成
作ったMaterialをCubeのMaterialにアタッチ
Two Hand Manipulatableを
Add Component
Manipulation Mode を
Moveにする
Trail RendererをAdd Component
TimeをInfinity
MinVertexDistanceを0.05
Widthを0.02
できた
ジェスチャを使う
TwoHandManipulatableを消す
DrawingManager.csを
VisualStudioで開く
ソースコード
https://gist.github.com/SatoshiRobatoFujimoto/85cea6
72f27567484ff322457f60a581
DrawingManager.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
使用するライブラリ
DrawingManager.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using HoloToolkit.Unity.InputModule; ジェスチャを使うために追記
DrawingManager.cs
public class DrawingManager : MonoBehaviour
{
// Use this for initialization
void Start()
{
}
// Update is called once per frame
void Update()
{
}
}
最初に一度だけ呼ばれる関数
フレームごとに呼ばれる関数
DrawingManager.cs
Public class DrawingManager : MonoBehaviour , ISourceStateHandler, IInputHandler
{
// Use this for initialization
void Start()
{
}
// Update is called once per frame
void Update()
{
}
}
手の検出 タップのUP/DOWNの検出
DrawingManager.cs
public class DrawingManager : MonoBehaviour , ISourceStateHandler, IInputHandler
{
// Use this for initialization
void Start()
{
InputManager.Instance.PushFallbackInputHandler(gameObject);
}
// Update is called once per frame
void Update()
{
}
}
どこでタップしてもイベントを発火させるハンドラの登録
DrawingManager.cs
public class DrawingManager : MonoBehaviour , ISourceStateHandler, IInputHandler
{
// Use this for initialization
void Start()
{
InputManager.Instance.PushFallbackInputHandler(gameObject);
}
// Update is called once per frame
void Update()
{
}
以下にイベントの関数を追記していく
DrawingManager.cs
//手が検出されたら発火する関数
public void OnSourceDetected(SourceStateEventData eventData)
{
Debug.Log("Detected");
}
//手がロストしたら発火する関数
public void OnSourceLost(SourceStateEventData eventData)
{
Debug.Log("Lost");
}
・・・
DrawingManager.cs
//人差し指を倒したとき(キーボードを押したときと同じ)
public void OnInputDown(InputEventData eventData)
{
Debug.Log("Down");
}
//人差し指を倒した状態から上げたとき(キーボードを離したときと同じ)
public void OnInputUp(InputEventData eventData)
{
Debug.Log("Up");
}
}
実行してConsoleを見てみる
• Shift押したときにDetected、離したときにLost
• タップ(Shift+クリック)したときにDown、Upが出力される
ソースコード
https://gist.github.com/SatoshiRobatoFujimoto/67dfba
9c72709790fe1645eafe693030
DrawingManager.cs
public GameObject obj;
private bool isDrag = false;
void Update()
{
if (isDrag)
{
//Cubeの位置を更新
}
}
public void OnInputDown(InputEventData eventData)
{
isDrag = true;
Debug.Log("Down");
}
public void OnInputUp(InputEventData eventData)
{
isDrag = false;
Debug.Log("Up");
}
public void OnSourceLost(SourceStateEventData eventData)
{
isDrag = false;
Debug.Log("Lost");
}
ドラッグしている間、なんかする
DrawingManager.cs
IInputSource currentInputSource;
private uint id;
public void OnInputDown(InputEventData eventData)
{
currentInputSource = eventData.InputSource;
id = eventData.SourceId;
・・・
タップしたときにイベントを更新
DrawingManager.cs
void Update()
{
if (isDrag)
{
//Cubeの位置を更新
Vector3 pos;
currentInputSource.TryGetGripPosition(id, out pos);
obj.transform.position = pos;
}
}
手の位置を取得する
ObjにCubeをアタッチする
実行
一回目タップ
二回目タップ
一回目タップ終了時から二回目タップ時まで線が引かれてしまう
→ドラッグし終わって、次のタップしたときから新しくCubeを生成する
ソースコード
https://gist.github.com/SatoshiRobatoFujimoto/fb69fa
cf8bbd242629b0e1cf986332ec
DrawingManager.cs
private GameObject obj;
public GameObject cube;
public void OnInputDown(InputEventData eventData)
{
currentInputSource = eventData.InputSource;
id = eventData.SourceId;
obj = GameObject.Instantiate(cube);
isDrag = true;
Debug.Log("Down");
}
タップしたらcubeを複製
CubeをProjectビューにD&Dして
HierarchyのCubeを消す
ProjectビューのCubeを
DrawingManagerのCubeへ
アタッチする
常に同じ位置から線が引かれてしまう
DrawingManager.cs
private GameObject obj;
public GameObject cube;
public void OnInputDown(InputEventData eventData)
{
currentInputSource = eventData.InputSource;
id = eventData.SourceId;
Vector3 pos;
currentInputSource.TryGetGripPosition(id, out pos);
cube.transform.position = pos;
obj = GameObject.Instantiate(cube);
isDrag = true;
Debug.Log("Down");
}
cubeを複製する前にcubeの位置を更新しておく
できた
けど、cubeが映るのがダサい
DrawingManager.cs
public void OnInputUp(InputEventData eventData)
{
obj.transform.localScale = Vector3.zero;
isDrag = false;
Debug.Log("Up");
}
ドラッグ終了時に、Cubeのスケールをゼロにする
できた
削除ボタン
ButtonのRect Trasformを調整する
フォントサイズは大きく、Scaleで調整
CanvasのRect Trasformを調整する
Render ModeをWorld Spaceにする
フォントサイズをデカくして
スケールで調整する
ソースコード
https://gist.github.com/SatoshiRobatoFujimoto/acfb33
7a45fafbe273dabaa10eaca426
DrawingManager.cs
public void ResetLines()
{
GameObject[] cubes = GameObject.FindGameObjectsWithTag("Cube");
foreach (GameObject cube in cubes)
{
Destroy(cube);
}
}
Cubeタグの付いたオブジェクトを
全て削除する
CubeのTagからAdd Tagを選択
Cubeのタグを作成
Cubeのタグを選択
ButtonのOn Click()に
DrawingManagerをアタッチする
作成したResetLines()関数を割り当てる
これでボタンをタップしたときにResetLines()が実行される
マウスクリックもできてしまうので注意
ボタンから離れてお絵描きしてから、ボタンを押してみる
できた
実機を奪え

20180822 ガチラボ vol.8