今回はピースが消えるときの演出をつけてみようと思います
■前回の内容
Todo : Add urlUnityでパズドラ風3Matchパズルを作る_その4_演出編3 - スマゲ
■本編の完成イメージ
■コード確認用リポジトリ
github.com
■環境
Mac OS Sierra 10.12.4
Unity 5.6.0 f3
言語 C#
■実装
ここからはその4の続きです
■アニメーションクラスの実装
[AlphaTween.cs]クラスを作成し、以下のように記述します
やっていることはMoveTweenとだいたい同じです。
using System.Collections; using System.Collections.Generic; using System; using UnityEngine; using UnityEngine.UI; // アルファアニメーションクラス public class AlphaTween : MonoBehaviour { // public. public Image thisImage; // private. private float fromAlpha; private float toAlpha; private float duration; private Action endCallBack; private bool isTween; private float elapsedTime; //------------------------------------------------------- // MonoBehaviour Function //------------------------------------------------------- private void Awake() { thisImage = GetComponent<Image>(); } // アニメーションの更新処理 private void Update() { if (!isTween) { return; } // アニメーション開始時からの経過時間 elapsedTime += Time.deltaTime; if (elapsedTime >= duration) { // アニメーションの終了処理 SetAlpha(toAlpha); isTween = false; if (endCallBack != null) { endCallBack(); } Destroy(this); return; } var moveProgress = elapsedTime / duration; SetAlpha(Mathf.Lerp(fromAlpha, toAlpha, moveProgress)); } //------------------------------------------------------- // Public Function //------------------------------------------------------- public void DoTween(float fAlpha, float tAlpha, float dur, Action eCallBack) { this.fromAlpha = fAlpha; this.toAlpha = tAlpha; this.duration = dur; this.endCallBack = eCallBack; SetAlpha(fAlpha); elapsedTime = 0; isTween = true; } //------------------------------------------------------- // Private Function //------------------------------------------------------- private void SetAlpha(float alpha) { var col = thisImage.color; col.a = alpha; thisImage.color = col; } }
■アルファアニメーションの適用
[Board.cs]を開いて、コマが削除される部分を書き換えます
// ピースを削除する var tweenAlpha = piece.gameObject.AddComponent<AlphaTween>(); tweenAlpha.DoTween(1, 0, 0.3f, () => Destroy(piece.gameObject));
■実行
■その5_コンボ表示
次回はコンボの表示等を行っていこうと思います。
■関連リンク
Unityでパズドラ風3Matchパズルを作る_その1_ロジック編 - スマゲ
Unityでパズドラ風3Matchパズルを作る_その2_演出編1 - スマゲ
Unityでパズドラ風3Matchパズルを作る_その3_演出編2 - スマゲ
Unityでパズドラ風3Matchパズルを作る_その4_演出編3 - スマゲ
Unityでパズドラ風3Matchパズルを作る_その6_ステータス表示編 - スマゲ