Unity技能CD倒计时效果的实现

• 首先我们创建两个Image，一个Text
  • 一个Image用于Button
  • 一个Image用于遮罩，调成变透明
  • 两个Image用同一个图片比较好
  • Text用于显示剩余技能冷却时间
• 此处我选择直接通过代码添加一个Button到SkillCD物体上

private Button btn;
void Start()
{
    btn = transform.AddComponent<Button>();
}

• 直接看图了解原理
  • 我们将图片类型Image Type改为Filled，即填充
  • 选择填充的方法 Fill Mothed 改为360°填充
  • 此时调整填充量Fill Amount 就会发现遮罩按照填充量0 - 360° 显示图片。（0<=Fill Amount<=1）
  • 我们也可以选择代码修改这些对象的值

public class SkillCD : MonoBehaviour
{
    private Image image;
    private Button btn;
    // Start is called before the first frame update
    void Start()
    {

        image = transform.Find("Override").GetComponent<Image>();
        image.raycastTarget = false;
        image.type = Image.Type.Filled;
        image.fillMethod = Image.FillMethod.Radial360;

        btn = transform.AddComponent<Button>();
    }

• 现在思路已经很明了，我们只需要通过代码计时控制遮罩Image的Fill Amount值，以及更新Text上的计数就可以实现简单的技能cd效果了！

• 先看效果
  
  

• 参考代码如下

using Unity.VisualScripting;
using UnityEngine;
using UnityEngine.UI;

public class SkillCD : MonoBehaviour
{
    [SerializeField]
    private float cd;
    private float curTime;
    private Text text;
    private Image image;
    private Button btn;
    // Start is called before the first frame update
    void Start()
    {
        text = GetComponentInChildren<Text>();
        text.raycastTarget = false;
        text.gameObject.SetActive(false);

        image = transform.Find("Override").GetComponent<Image>();
        image.raycastTarget = false;
        image.type = Image.Type.Filled;
        image.fillMethod = Image.FillMethod.Radial360;
        cd = 10;

        btn = transform.AddComponent<Button>();
        btn.onClick.AddListener(()=>{
            curTime = cd;
            image.fillAmount = 1;
            text.gameObject.SetActive(true);
            btn.enabled = false;
        });
    }

    // Update is called once per frame
    void Update()
    {
        if (curTime > 0)
        {
            curTime -= Time.deltaTime;
            image.fillAmount = curTime / cd;
            text.text = ((int)curTime).ToString();
            if (curTime < 0)
            {
                text.gameObject.SetActive(false);
                btn.enabled = true;
            }
        }
    }
}