Unity でタップ跡のエフェクトを表示する
※ これは 2021/01/22 時点の Unity 2020.2.2f1 の情報です
最新版では動作が異なる可能性がありますのでご注意ください
前回はマウスクリックした場所にねこキャラが移動するようにしたけど、そのままだとマウスカーソルが表示されないスマホなどだとタップ位置がわからない問題を改善したい
というわけでクリック位置に下記のようなアニメーションのタップ跡エフェクトを表示する
とりあえず上記のアニメーションを設定した GameObject
で TapEffect
という名前の下記のような Prefab
を作る
最前面に表示されるように SpriteRenderer
の Additional Settings
を適切に設定するのがポイント
オーバーレイ用の Sorting Layer
とか追加してもいいけど、とりあえず Order in Layar
を他の Sprite
より大きめの数値にすれば大丈夫なはず
次に Cat.cs
を変更・・・ほんとは OverlayLayer
みたいな画面共通のものに分けた方がいいかもしれない
using UnityEngine; using UnityEngine.InputSystem; public class Cat : MonoBehaviour { [SerializeField] private GameObject tapEffect = null; private Animator animator = null; private Vector2 target = Vector2.zero; public void Awake() { this.animator = this.GetComponent<Animator>(); this.target = (Vector2)this.transform.position; } public void Update() { var direction = this.target - (Vector2)this.transform.position; if (direction != Vector2.zero) { var normalized = new Vector3(Mathf.Round(direction.normalized.x), Mathf.Round(direction.normalized.y), 0); // 斜め方向も許容 if (normalized != Vector3.zero) { this.animator.SetFloat("x", normalized.x); this.animator.SetFloat("y", normalized.y); } this.transform.Translate(direction.normalized * Time.deltaTime * 3f); } } public void OnFire(InputAction.CallbackContext context) { this.target = Camera.main.ScreenToWorldPoint(Mouse.current.position.ReadValue()); // タップ跡を表示 var effect = Instantiate(this.tapEffect, this.target, Quaternion.identity, this.transform.parent); // 1秒後に消滅 Destroy(effect, 1f); } }
SerializeField
経由で TapEffect
の Prefab
を参照し、クリックされたときにこの Prefab
を生成して1秒後に消す処理を入れるだけ
最後に Hierarchy
上の Cat
に忘れずに TapEffect
の Prefab
を設定する
これでお試し
すばやく連打してもダダダッと複数表示された!