技能按钮CD效果

废话不多说，直接上代码！

using System;
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class Skill : MonoBehaviour//技能
{
    Button but;//技能按钮 Button组件
    Image img;//CD遮罩图片
    Text txt;//CD显示文本
    bool isgo = false;//是否开启CD计时
    float time = 0;//CD计时器
    void Start()
    {
        but = GetComponent<Button>();//获取自身按钮组件
        img = transform.GetChild(0).GetComponent<Image>();//获取子对象第一个，获取它的图片组件
        txt = transform.GetChild(1).GetComponent<Text>();//获取子对象第二个，获取它的文本组件
        but.onClick.AddListener(But);//给按钮添加侦听方法 也就是按下按钮，它会触发的方法
    }

    private void But()//按钮触发方法
    {
        img.gameObject.SetActive(true);//CD遮罩显示
        txt.gameObject.SetActive(true);//CD文本显示
        isgo = true;//开启CD计时
    }

    void Update()
    {
        if (isgo == true)//可以开始计时 这里写的是三秒CD
        {
            but.enabled = false;//按钮组件先失活 避免出现CD遮罩少了一部分的时候，能点击释放技能
            time += Time.deltaTime;//计时
            img.fillAmount = 1 - (time / 3);//(time/3)计算计时到了CD的百分比，图片的满填充默认值是1（可以调节），1-百分比就是不断调节填充之，达到减少CD遮罩的效果
            txt.text = Mathf.Ceil(3.0f - time).ToString();//显示CD数值 Mathf.Ceil向上取整的意思，ToString转字符串这样文本才能显示
            if (img.fillAmount <= 0)//判断CD遮罩小于等于0的时候
            {
                isgo = false;//关闭CD计时
                img.fillAmount = 1;//CD遮罩填充值重置为1，为了下次的使用
                img.gameObject.SetActive (false);//CD遮罩隐藏
                txt.gameObject.SetActive (false);//CD文本隐藏
                txt.text = "";//CD文本重置,为了下次使用
                time = 0;//计时器清零，不然下次就是从3秒多开始，那么就直接结束了，不会有CD遮罩这个过程了，避免Bug
                but.enabled = true;//关于CD的都重置完毕之后，按钮组件激活，继续使用
            }
        }
    }
}

效果展示：

 设置：

Image填充类型设置 ：

 然后就会变成这样，其它不用调，默认就行（看自己喜好）