LoginSignup
23
17

More than 5 years have passed since last update.

Unity&Live2Dでマウスドラッグの軌跡を出す

Last updated at Posted at 2015-08-13

Live2D使ったアプリでマウスやタッチの軌跡を出すやり方をメモしておきます。

開発環境

・Live2D_SDK_Unity_2.1.00_beta_8_jp
・Unity 5.0.1f1
・Live2Dモデル(noshipuさんのベルツノさんモデルをお借りました)

軌跡のやり方

軌跡表示はUnityの一般的なやり方なので、Live2D以外でも有効です。

主な方法としては、以下2点あります。

・Trail Rendererを使う
・Particle Systemを使う

Live2Dの場合、どちらの方法でも軌跡が半透明オブジェクトだとLive2Dモデルの後ろに描画されます
 01_drag.gif
つまり、半透明オブジェクトでなければLive2Dモデルの前に表示されます。

<透明でないオブジェクトの場合>
02_1.png
<半透明のオブジェクトの場合>
02_2.png

これはLive2DがDrawMeshNowというUnityの描画方式を使ってるためです。
そのため、以下どちらかの描画モードに変更する必要があります。

1)描画モードをDRAW_MESHに変更する
 → 複数Live2Dモデルの描画順を制御するの「2.描画モードを変更しZ値で制御する」を参考に

2)RenderTextureで描画する
 → Live2D SDKのRenderTextureプロジェクトを使う
 参考ページ:UnityでLive2Dを簡単フェードインアウト

Trail Rendererを使う

1)まず空のGameObjectを作ります。名前はDragPointerとします

2)軌跡用のマテリアルを作ります。ShaderはParticles/Additiveにします
 03.png

3)Trail Rendererをアタッチします。先ほど作ったマテリアルをセットし、軌跡の設定はこんな感じに
 04.png

4)DragPointerのGameObjectにスクリプトをアタッチします

TrailRender.cs
using UnityEngine;
using System.Collections;

public class TrailRender : MonoBehaviour {

    void Update () {
        // マウス左クリック時
        if (Input.GetMouseButton(0))
        {
            Vector3 screenPosition = new Vector3(Input.mousePosition.x, Input.mousePosition.y, Camera.main.nearClipPlane + 1.0f);

            gameObject.transform.position = Camera.main.ScreenToWorldPoint(screenPosition);
        }
    }
}

はい、これで実行してマウスドラッグすると軌跡が完成です!
 05_drag.gif

Particle Systemを使う

Trailだと軌跡ラインしか表示されないので、Particleでやる方法です。

1)まずDragPointerのTrail Rendererのチェックは外しておきます
 06.png

2)Resources/Particlesフォルダを作り、ParticleSystemをprefab化したものをいれます
 (Trail_Starという名前にします)
  そしてMaterialを作成し、以下の画像を選択します
 star.png

 07.png

3)ParticleSystemの設定は以下のようにし、作ったMaterialを使います
 08.png
 Color over Lifetimeに関しては、以下のように最初と最後(クロスライダー部分)を透明度0%にします。
 そうする事でパーティクルのフェードインフェードアウトできます。
 08_3.png

4)以下のスクリプトを作って、DragPointerにアタッチします

TrailRender.cs
using UnityEngine;
using System.Collections;

public class TrailRender : MonoBehaviour {

    private GameObject Particle_prefab;
    private GameObject Particle;

    void Start(){
        Particle_prefab = (GameObject)Resources.Load("Particles/Trail_Star");
    }

    void Update () {
        if (Input.GetMouseButton(0))
        {
            Vector3 screenPosition = new Vector3(Input.mousePosition.x,
                                                 Input.mousePosition.y,
                                                 Camera.main.nearClipPlane + 1.0f);
            gameObject.transform.position = Camera.main.ScreenToWorldPoint(screenPosition);

            Vector3 vecHeartPos = gameObject.transform.position;
            Particle = (GameObject)Instantiate(Particle_prefab, vecHeartPos, Quaternion.identity);
            // 1秒後に消す
            Destroy(Particle, 1.0f);
        }
    }
}

これで実行してマウスドラッグするとParticleの軌跡が完成ですっ!
 09_drag.gif

Live2D使ったアプリがどのように実装されているかわかりませんが、Unityならだいたい同じようにやっているかと思います。

参考URL:TrailRendererでマウス軌跡

23
17
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
23
17