Edited at

HoloLensで壁に落書きする方法

More than 1 year has passed since last update.


概要


  • HoloLensで壁に落書きできるアプリを作ってみました

  • HoloToolkitとInkPainterを組み合わせて簡単に実装できます

  • エアダスターとAirTapを組み合わせると塗ってる感が出ます


仕組み


開発環境


仕組み


  • HoloToolkitのSpatialMappingの機能一つ,SpatialProcessingを利用しています

  • SpatialProcessingはSpatialMappingで得られたデータから平面構成のMappingデータに変換してくれるモジュールです

  • 今回はSpatialProcessingで得られた平面にInkPainterを用いて落書きを行います


実装



  1. シーンのロード


    • HoloToolkitをプロジェクトにインポート(この時HoloToolkit-Testsもインポートする)

    • InkPainterをインポート

    • HoloToolkit-Tests/SpatialMapping/Scenes/SpatialProcessing.unityをロード
      Paint1.png




  2. Inputモジュールの追加


    • HoloToolkit/Input/PrefabsからInputManagerとCursor/CursorをHierarchyに追加
      Paint2.png




  3. SurfacePlaneの変更

    HoloToolkit/SpatialMapping/Prefabs/SurfacePlaneを一部変更します.


    • スクリプトの追加


      • InspectorからInkCanvasを追加



    • Colliderの変更


      • BoxColliderをMeshColliderに変更する



    • マテリアルの追加


      • SurfacePlaneにアタッチされているマテリアル(HoloToolkit_Default)のShaderをUnlit/Transparentに変更

      • Textureを以下の画像に変更(透明な画像です)
        alphaImage.png



    ↑透明画像




  • コードの修正


    • SurfacePlane.csの126行目を削除


      SetPlaneMaterialByType();

      Paint3.png




  1. ペイント入力の実装


    • ペイント入力のコード(Paint.cs)を以下に示します

    • Paint.csをHoloLensCameraに追加しBrushTextureとBrushColorを設定

    • メニューバーのHoloToolkitからConfigure/ApplyHoloLensCapabilitySettingを選択しSpatialPerceptionを有効にする

    • BuildWindowよりプロジェクトをビルドしHoloLensで確認してください




Paint.cs

using UnityEngine;

using Es.InkPainter;
using UnityEngine.VR.WSA.Input;

public class Paint : MonoBehaviour {

[SerializeField]
private Brush brush;

private bool pressflag = false;

private void Start()
{
InteractionManager.SourceUpdated += InteractionManager_SourceUpdated;
InteractionManager.SourcePressed += InteractionManager_SourcePressed;
InteractionManager.SourceReleased += InteractionManager_SourceReleased;
}

private void Update()
{

}

void InteractionManager_SourceUpdated(InteractionSourceState state)
{
if (pressflag == true)
{
Vector3 v;
state.properties.location.TryGetPosition(out v);
RaycastHit hitInfo;
if (Physics.Raycast(v, Camera.main.transform.forward, out hitInfo))
{
var paintObject = hitInfo.transform.GetComponent<InkCanvas>();
if (paintObject != null) paintObject.Paint(brush, hitInfo);
}
}

}

void InteractionManager_SourcePressed(InteractionSourceState state)
{
pressflag = true;
}

void InteractionManager_SourceReleased(InteractionSourceState state)
{
pressflag = false;
}
}


Paint4.png

HoloLensでアプリ起動後

- SpatialMappingによるワイヤーフレームの表示

- SpatialProcessing後に透明色に変更

- AirTapにより視線上の壁にペイントされます


まとめ