【Unity】トレイルレンダラーでレーザーを表示する

レーザーを表示したいなと思って実装方法を色々と考えたのですが、Unityにはトレイルレンダラーというオブジェクトが動いた跡の軌跡を表示する機能があったので、それを使って実装してみました。


unitypackageとProjectSettingsのファイルはこちら
ファイルのダウンロード
Unity2018.2.11f1使用

Zipファイルになっていますので展開したらLaser_TEST.unitypackageとProjectSettingsフォルダが入っています。

ファイルメニューのAsset→Import Package→Custom Packageを選択してLaser_TEST.unitypackageを読み込みます。

ProjectSettingsフォルダは作成したプロジェクトにあるProjectSettingsフォルダに上書きします。

実行すると左クリックした位置にレーザーを表示します。

作成方法書いてみます。
まず下の2枚の画像をプロジェクトフォルダの適当な場所に保存します。


ProjectタブのCreateからMaterialをクリックして適当な名前を付けます。Laser_tailとしておきました。


作成したMaterialを選択しInspectorのShaderをParticles→Alpha Blendedに変更します。
画像を選択するSelectを押して、最初に追加した画像Laser_tailに変更します。


同じようにLaser_topのMaterialも作っておきます。

次にHierarchyタブでCreate→3D Object→Planeでオブジェクトを作成します。
名前はLaser_prefabにしておきます。


作成したLaser_prefabを選択してInspectorのMesh RendererのMaterialsのElement 0タブのマテリアルをLaser_topに変更します。
InspectorのScaleをxyz共に0.1にしておきます。


ProjectタブでCreate→Folderで空のフォルダを作成。名前はScriptにします。
ScriptフォルダでCreate→C# Scriptで新しいスクリプトを作成。名前はLaser_moveにして下記のコードを追加します。
Laser_move.cs
using System.Collections; using System.Collections.Generic; using UnityEngine; public class Laser_move : MonoBehaviour { void Start () { transform.rotation = Quaternion.Euler(90, 0, 0);//画像回転 } void Update () { transform.Translate(0, 0, -0.6f);//自機弾の速さ if (transform.position.y > 25f) { //transform.DetachChildren();//親オブジェクトから子オブジェクトを解除 Destroy(gameObject);//自機弾削除 } } }  
作成したLaser_moveスクリプトをHierarchyタブにあるLaser_prefabにアタッチします。

HierarchyタブのMainCameraのPositionをXを０、Yを20、Zを-10にします。

この時点で再生ボタンを押してみて弾が移動すればOK。

トレイルレンダラーの設定をします。
HierarchyタブにあるLaser_prefabを選択してInspectorタブのAdd Componentを押してEffect→Trail Rendererを選択します。


Trail RendererタブのMaterialsの中のElement 0のマテリアルをLaser_tailにします。


Timeを0.5にします。
Colorクリックすると別でダイアログが出るので

右上のAlphaを0に


左下のColorを緑（好きな色で良いです）にします。

これでトレイルレンダラーの設定は終了。再生ボタンを押すとレーザーっぽい軌跡が表示されたと思います。

ここまで出来たらProjectタブにPrefabフォルダを新しく作成してHierarchyタブのLaser_prefabをProjectタブのPrefabフォルダに移動してHierarchyタブのLaser_prefabは削除しておきます。

次にレーザーの出現処理を追加します。
画面をクリックしたらクリックした場所にレーザーが発射されるようにしてみました。
Hierarchyタブに空のGameObjectを作成して名前をLaser_Createにします。
ProjectタブのScriptフォルダにCreate→C# Scriptで新しいスクリプトを作成。名前はLaser_Createにして下記のコードを追加します。

Laser_Create.cs
using System.Collections; using System.Collections.Generic; using UnityEngine; public class Laser_Create : MonoBehaviour { public GameObject Laser_prefab;//Laser_prefabをインスペクターに用意 void Start () { } void Update () { if (Input.GetMouseButtonDown(0))//マウスを左クリックした時 { Vector3 touchScreenPosition = Input.mousePosition;//マウス座標を代入 touchScreenPosition.z = 10.0f;//ScreenToWorldPointを使うための呪文 Camera gameCamera = Camera.main;//カメラ取得 Vector3 touchWorldPosition = gameCamera.ScreenToWorldPoint(touchScreenPosition);//マウス座標をワールド座標に変換 Debug.Log("LeftClick:" + touchWorldPosition);//取得座標表示 Instantiate(Laser_prefab, touchWorldPosition , Quaternion.identity);//クリック位置にレーザー生成 } } }
作成したLaser_CreateスクリプトをHierarchyタブにあるLaser_Createにアタッチします。

アタッチするとInspectorタブにLaser_prefabタブが出来ますので、ProjectタブのLaser_prefabをアタッチします。

この状態で再生ボタンを押すと、画面を左クリックするたびにレーザーが表示されるようになったと思いますが、レーザーが上まで行って消えてしまうと一瞬でテールも消えてしまうと思います。


これは先頭のレーザーが消えたときにトレイルレンダラーも消えてしまうために起こります。
なのでレーザーに親子関係をもたせてトレイルレンダラーは子オブジェクトに追加して親のオブジェクトが消えた瞬間に子を切り離して残しておくようにすると上手く行きました。

まず、ProjectタブのLaser_prefabをHierarchyタブにドラッグアンドドロップします。
HierarchyタブのLaser_prefabを右クリックして空のGameObjectを作成し名前をLaser_tailにしておきます。


Laser_tailに先ほどと同じようにトレイルレンダラーの設定をします。Laser_prefabの方のトレイルレンダラーは削除しておきましょう。


ProjectタブのScriptフォルダにCreate→C# Scriptで新しいスクリプトを作成。名前はLaser_Tailにして下記のコードを追加します。

Laser_Tail.cs
using System.Collections; using System.Collections.Generic; using UnityEngine; public class Laser_Tail : MonoBehaviour { private int time;//経過フレーム用 void Start () { time = 0;//初期化 } void Update () { time++; if(time>60)//60フレーム後に削除 { Destroy(gameObject); } } }
作成したLaser_TailスクリプトをHierarchyタブにあるLaser_Tailにアタッチします。


先程作成したLaser_move.csの16行目のコメントアウトしてある
//transform.DetachChildren();//親オブジェクトから子オブジェクトを解除
のコメントアウトを削除します。
このtransform.DetachChildren();関数で親オブジェクトから子オブジェクトを切り離せるみたいです。

HerarchyタブのLaser_prefabを選択してInspectorタブのPrefabのApplyを押すと変更した内容がProjectの方のPrefabに上書きされるので、HierarchyタブのLaser_prefabは削除しておきます。

この状態で再生すると、ちゃんと先頭のレーザーが消えてもテール部分は残り続けて良い感じでレーザーを表示する事が出来たと思います。
ただ、トレイルレンダラーにはコライダーなどの当たり判定を付けることが出来ないっぽい？ので自分で実装する必要がありそうなのでテール部分に当たり判定が付けたい場合は別の方法を考えた方が良いかもしれませんね。

それとScreenToWorldPoint関数を使うときにMain CameraのTagがMain Cameraになっていないと上手く動きませんでした。