ツイステの選択肢ボタンの演出を再現してみたいと思う。タップすると残像?のようなものが手前に迫ってくる演出のことだ。*1 youtu.be
完成図
実装
残像用のオブジェクトをボタンとは別に用意してDoTweenで動かした。
using DG.Tweening; using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; public class test_TW_choiceButtonEffect : Button { private List<GameObject> buttonList = new List<GameObject>(); protected override void Start() { foreach (Transform t in this.transform.parent) { this.buttonList.Add(t.gameObject); } } public override void OnPointerDown(UnityEngine.EventSystems.PointerEventData eventData) { //縮む float scale = 0.95f; transform.localScale = new Vector3(scale, scale, scale); } public override void OnPointerUp(UnityEngine.EventSystems.PointerEventData eventData) { //元に戻る transform.localScale = Vector3.one; } public override void OnPointerClick(UnityEngine.EventSystems.PointerEventData eventData) { gameObject.GetComponent<Button>().enabled = false; //残像用のオブジェクト作成 GameObject effectObj = GameObject.Instantiate(this.gameObject); effectObj.transform.SetParent(this.transform.parent, false); float effectTime = 0.7f; Sequence seq = DOTween.Sequence(); seq.AppendCallback(() => { DOTween.To(() => effectObj.GetComponent<CanvasGroup>().alpha, (n) => effectObj.GetComponent<CanvasGroup>().alpha = n, 0, effectTime); effectObj.transform.DOScale(1.5f, effectTime).onComplete = () => { Destroy(effectObj); }; //選ばれなかった選択肢が消える演出 foreach (GameObject t in this.buttonList) { if(t != this.gameObject) { DOTween.To(() => t.GetComponent<CanvasGroup>().alpha, (n) => t.GetComponent<CanvasGroup>().alpha = n, 0, effectTime); } } }); seq.AppendInterval(effectTime + 1f); //選択したものを見せる時間 seq.Append(DOTween.To(() => gameObject.GetComponent<CanvasGroup>().alpha, (n) => gameObject.GetComponent<CanvasGroup>().alpha = n, 0, 0.1f)); seq.AppendCallback(() => { Destroy(this.gameObject); }); } }