コガネブログ

平日更新を目標に Unity や C#、Visual Studio、ReSharper などのゲーム開発アレコレを書いていきます

【Unity】タッチジェスチャを簡単に実装できる「TouchScript」の基本的な使い方を紹介

はじめに

「TouchScript」を Unity プロジェクトに導入することで
タッチジェスチャを簡単に実装できるようになります

この記事では「TouchScript」の基本的な使い方を紹介していきます

目次

検証環境

  • Unity 2017.3.0f3
  • TouchScript 9.0

インストール

  1. 下記のページにアクセスして「TouchScript.unitypackage」をダウンロードします
    https://github.com/TouchScript/TouchScript/releases
  2. ダウンロードした「TouchScript.unitypackage」を
    Unity プロジェクトにインポートします

クイックスタート

f:id:baba_s:20180320173351p:plain

「Cursors」プレハブと「TouchManager」プレハブをシーンに配置します

f:id:baba_s:20180320173435p:plain

シーンに Cube を作成して

f:id:baba_s:20180320173523p:plain

Scale を ( 2, 2, 2 ) に設定して

f:id:baba_s:20180320173650p:plain

「TransformGesture」と「Transformer」をアタッチします

f:id:baba_s:20180320173852g:plain

これで、Unity を再生して、Cube をドラッグすると移動できます
さらに、Alt を押しながら Cube をクリックしてから
Alt を押したままドラッグすると、回転やスケーリングができます

TouchScript を使用すると、このような処理が簡単に実装できます

ポインタ入力

using TouchScript;
using UnityEngine;

public class Example : MonoBehaviour
{
    private void OnEnable()
    {
        var t = TouchManager.Instance;
        if ( t == null ) return;
        t.PointersPressed += OnPointersPressed;
    }

    private void OnDisable()
    {
        var t = TouchManager.Instance;
        if ( t == null ) return;
        t.PointersPressed -= OnPointersPressed;
    }

    private void OnPointersPressed( object sender, PointerEventArgs e )
    {
        foreach ( var n in e.Pointers )
        {
            Debug.LogFormat( "Id: {0} Position: {1}", n.Id, n.Position );
        }
    }
}

上記のようなコードでポインタ入力を検出できます

ジェスチャ

タップされた

f:id:baba_s:20180320175234p:plain

「TapGesture」を使用することで、
そのオブジェクトがタップされたかどうかを検出できます

using System;
using TouchScript.Gestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public TapGesture tapGesture;

    private void OnEnable()
    {
        tapGesture.Tapped += OnTapped;
    }

    private void OnDisable()
    {
        tapGesture.Tapped -= OnTapped;
    }

    private void OnTapped( object sender, EventArgs e )
    {
        Debug.Log( "タップされた" );
    }
}

押された

f:id:baba_s:20180320175504p:plain

「PressGesture」を使用することで、
そのオブジェクトが押されたかどうかを検出できます

using System;
using TouchScript.Gestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public PressGesture pressGesture;

    private void OnEnable()
    {
        pressGesture.Pressed += OnPressed;
    }

    private void OnDisable()
    {
        pressGesture.Pressed -= OnPressed;
    }

    private void OnPressed( object sender, EventArgs e )
    {
        Debug.Log( "押された" );
    }
}

離された

f:id:baba_s:20180320175634p:plain

「ReleaseGesture」を使用することで、
そのオブジェクトが離されたかどうかを検出できます

using System;
using TouchScript.Gestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public ReleaseGesture releaseGesture;

    private void OnEnable()
    {
        releaseGesture.Released += OnReleased;
    }

    private void OnDisable()
    {
        releaseGesture.Released -= OnReleased;
    }

    private void OnReleased( object sender, EventArgs e )
    {
        Debug.Log( "離された" );
    }
}

長押しされた

f:id:baba_s:20180320175829p:plain

「LongPressGesture」を使用することで、
そのオブジェクトが長押しされたどうかを検出できます

using System;
using TouchScript.Gestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public LongPressGesture longPressGesture;

    private void OnEnable()
    {
        longPressGesture.LongPressed += OnLongPressed;
    }

    private void OnDisable()
    {
        longPressGesture.LongPressed -= OnLongPressed;
    }

    private void OnLongPressed( object sender, EventArgs e )
    {
        Debug.Log( "長押しされた" );
    }
}

フリックされた

f:id:baba_s:20180320180407p:plain

「FlickGesture」を使用することで、
そのオブジェクトがフリックされたどうかを検出できます

using System;
using TouchScript.Gestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public FlickGesture flickGesture;

    private void OnEnable()
    {
        flickGesture.Flicked += OnFlicked;
    }

    private void OnDisable()
    {
        flickGesture.Flicked -= OnFlicked;
    }

    private void OnFlicked( object sender, EventArgs e )
    {
        Debug.Log( "フリックされた: " + flickGesture.ScreenFlickVector );
    }
}

平行移動、回転、スケーリングされた

f:id:baba_s:20180320182645p:plain

「TransformGesture」を使用することで、
そのオブジェクトが平行移動、回転、スケーリングされたかどうかを検出できます
回転とスケーリングは Alt を押しながらドラッグする必要があります

using System;
using System.Text;
using TouchScript.Gestures.TransformGestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public TransformGesture transformGesture;

    private void OnEnable()
    {
        transformGesture.TransformStarted   += OnTransformStarted;
        transformGesture.Transformed        += OnTransformed;
        transformGesture.TransformCompleted += OnTransformCompleted;
    }

    private void OnDisable()
    {
        transformGesture.TransformStarted   -= OnTransformStarted;
        transformGesture.Transformed        -= OnTransformed;
        transformGesture.TransformCompleted -= OnTransformCompleted;
    }

    private void OnTransformStarted( object sender, EventArgs e )
    {
        Debug.Log( "変形を開始した" );
    }

    private void OnTransformed( object sender, EventArgs e )
    {
        var g = transformGesture;
        var sb = new StringBuilder();
        sb.AppendLine( "変形中" );
        sb.AppendLine( "LocalDeltaPosition : " + g.LocalDeltaPosition );
        sb.AppendLine( "DeltaPosition : "      + g.DeltaPosition );
        sb.AppendLine( "DeltaRotation: "       + g.DeltaRotation );
        sb.AppendLine( "DeltaScale: "          + g.DeltaScale );
        sb.AppendLine( "RotationAxis: "        + g.RotationAxis );
        Debug.Log( sb );
    }

    private void OnTransformCompleted( object sender, EventArgs e )
    {
        Debug.Log( "変形を完了した" );
    }
}

平行移動、回転、スケーリングされた(スクリーン座標)

f:id:baba_s:20180320190559p:plain

「ScreenTransformGesture」を使用することで、
そのオブジェクトが平行移動、回転、スケーリングされたかどうかを検出できます
回転とスケーリングは Alt を押しながらドラッグする必要があります
「TransformGesture」と似ていますが、パラメータがスクリーン座標系で計算されます

using System;
using System.Text;
using TouchScript.Gestures.TransformGestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public ScreenTransformGesture transformGesture;

    private void OnEnable()
    {
        transformGesture.TransformStarted   += OnTransformStarted;
        transformGesture.Transformed        += OnTransformed;
        transformGesture.TransformCompleted += OnTransformCompleted;
    }

    private void OnDisable()
    {
        transformGesture.TransformStarted   -= OnTransformStarted;
        transformGesture.Transformed        -= OnTransformed;
        transformGesture.TransformCompleted -= OnTransformCompleted;
    }

    private void OnTransformStarted( object sender, EventArgs e )
    {
        Debug.Log( "変形を開始した" );
    }

    private void OnTransformed( object sender, EventArgs e )
    {
        var g = transformGesture;
        var sb = new StringBuilder();
        sb.AppendLine( "変形中" );
        sb.AppendLine( "DeltaPosition : " + g.DeltaPosition );
        sb.AppendLine( "DeltaRotation: "  + g.DeltaRotation );
        sb.AppendLine( "DeltaScale: "     + g.DeltaScale );
        sb.AppendLine( "RotationAxis: "   + g.RotationAxis );
        Debug.Log( sb );
    }

    private void OnTransformCompleted( object sender, EventArgs e )
    {
        Debug.Log( "変形を完了した" );
    }
}

オブジェクトの中心を原点に回転、スケーリングされた

f:id:baba_s:20180320191436p:plain

「PinnedTransformGesture」を使用することで、
そのオブジェクトが回転、スケーリングされたかどうかを検出できます
「TransformGesture」と違い、ドラッグで回転とスケーリングができます

using System;
using System.Text;
using TouchScript.Gestures.TransformGestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public PinnedTransformGesture transformGesture;

    private void OnEnable()
    {
        transformGesture.TransformStarted   += OnTransformStarted;
        transformGesture.Transformed        += OnTransformed;
        transformGesture.TransformCompleted += OnTransformCompleted;
    }

    private void OnDisable()
    {
        transformGesture.TransformStarted   -= OnTransformStarted;
        transformGesture.Transformed        -= OnTransformed;
        transformGesture.TransformCompleted -= OnTransformCompleted;
    }

    private void OnTransformStarted( object sender, EventArgs e )
    {
        Debug.Log( "変形を開始した" );
    }

    private void OnTransformed( object sender, EventArgs e )
    {
        var g = transformGesture;
        var sb = new StringBuilder();
        sb.AppendLine( "変形中" );
        sb.AppendLine( "DeltaPosition : " + g.DeltaPosition );
        sb.AppendLine( "DeltaRotation: "  + g.DeltaRotation );
        sb.AppendLine( "DeltaScale: "     + g.DeltaScale );
        sb.AppendLine( "RotationAxis: "   + g.RotationAxis );
        Debug.Log( sb );
    }

    private void OnTransformCompleted( object sender, EventArgs e )
    {
        Debug.Log( "変形を完了した" );
    }
}

その他

画面全体のジェスチャを検出

f:id:baba_s:20180320191906p:plain

通常、各ジェスチャはオブジェクトに対して判定がありますが、
「FullscreenLayer」を使用することで、
画面全体に対して判定をつけることができます

ジェスチャの詳細設定

f:id:baba_s:20180320192154p:plain

各コンポーネントの「Switch to Advanced」ボタンを押すと、
詳細設定ができるようになります

イベントを UnityEvent で受け取る

f:id:baba_s:20180320192444p:plain

「Use Unity Events」をチェックすることで、
イベントを UnityEvent で受け取れるようになります

using System;
using TouchScript.Gestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public TapGesture tapGesture;

    private void OnEnable()
    {
        tapGesture.OnTap.AddListener( OnTapped );
    }

    private void OnDisable()
    {
        tapGesture.OnTap.RemoveListener( OnTapped );
    }

    private void OnTapped( Gesture gesture )
    {
        Debug.Log( "タップされた" );
    }
}

イベントを SendMessage で受け取る

f:id:baba_s:20180320192619p:plain

「Use SendMessage」をチェックすることで、
イベントを SendMessage で受け取れるようになります

using TouchScript.Gestures;
using UnityEngine;

public class Example : MonoBehaviour
{
    public TapGesture tapGesture;

    private void OnTap( Gesture gesture )
    {
        Debug.Log( "タップされた" );
    }
}

参考サイト様

http://nicoletjpblog.blogspot.jp/2017/05/touchscript.html

関連記事