基本原理:使用中的方法,通过代码控制实现图标的冷却效果。
主要步骤:
1 在其中创建一个图像并为其命名,例如“”;
2 在(Image)下,创建两个sub-(Bkg and Mask0)和一个sub-Text;如下图,Bkg可以用来给图标加框魔兽世界屏幕中间的冷却图标,但不是必须的;
3 导入需要的图标素材,设置类型为Type in Type。根据需要调整导入参数后,应用。
我以上面的图标素材为例。
用作技能图标
用作 Bkg 框架
4 将素材添加到对应的Image组件中魔兽世界屏幕中间的冷却图标,如下:
为简单起见,Mask 使用了 unity 的 ()
5 Mask的设置如下:
将颜色设置为深色,并根据需要调整透明度,如下:
现在,您可以手动拖动填充的滚动条来查看冷却效果。
技能冷却效果需要和实际冷却时间相关,所以下一步需要通过代码来实现:
6 编写冷却时间和冷却效果控制代码(C#)。本代码仅供参考,仅提供实现思路。实际使用需要根据具体情况进行调整。
private const float m_CD_0 = 2f; // 冷却时间,2s
private float[] m_CD_Left = new float[3];
private bool[] CD_Trigger = new bool[3];
private Image[] m_Masks = new Image[3];
private Text[] m_Texts = new Text[3];
void Start () {
CD_Trigger [0] = false; // 初始化为false,在Update()中,跳过冷却计时代码;
m_CD_Left[0] = m_CD_0; // 初始化为对应冷却时间
m_Masks[0] = GameObject.Find("Mask0").GetComponent(); // 获取Mask的实例,可用其他方法
m_Masks[0].enabled = false; // 禁用Mask,确保开始时,技能图标效果为可用;
m_Texts[0] = BtnObject.GetComponentInChildren(); // 获取Text实例,可用其他方法
m_Texts[0].enabled = false; // 禁用Text,确保开始时,技能图标上无冷却数字显示;
}
void Update () {
// 此处我有多个按钮需要不同的CD,因此用了数组;
// CD_Trigger[0] 是一个bool值,用于判断是否开始冷却计时;
if (CD_Trigger[0]) {
m_CD_Left[0] -= Time.deltaTime; // m_CD_Left[0] 冷却开始后,计算冷却剩余时间
m_Masks[0].fillAmount = m_CD_Left[0] / m_CD_0;
// 更新对应mask的Image.FillAmount, 由于FillAmount是[0,1],要换算成对应范围的小数
m_Texts[0].text = string.Format("{0:F1}", m_CD_Left[0]);
// 更新技能文本中的数字显示,采用string.Format,详情可参考C#官方文档,“F1”表示一位小数
if (m_CD_Left[0] < 0) { // 如果剩余冷却时间为0,则停止冷却,并重新初始化相关变量。
CD_Trigger[0] = false; // 下一个frame开始将不再执行if (CD_Trigger[0]){...}语句块的代码;
m_CD_Left[0] = m_CD_0; // 剩余冷却时间重新赋值为初始值
m_Masks[0].enabled = false; // Mask被禁用,不显示在图标上
m_Texts[0].enabled = false; // Text被禁用,不显示数值
}
}
}
// 技能释放,在角色施法时被调用,这里是一个重载
// index是技能编号,groupindex是对应按钮编号,与本文无关可忽略。
public void SpellCast(int index, int groupindex){
if (!CD_Trigger [groupindex]) { // 如果技能不再冷却中,则释放技能并开始冷却计时;如果技能在冷却,则跳过;
CmdSpell (index,2f,SpellCastPosition.position,SpellCastPosition.rotation,groupindex);
// 真正的技能释放,与本文无关。
CD_Trigger[groupindex] = true; // 赋值为True,下一个frame,开始冷却计时
m_Masks[groupindex].enabled = true; // 启用Mask(Image)
m_Masks[groupindex].fillAmount = 1; // FillAmount设为1,确保效果显示正确
m_Texts[groupindex].enabled = true; // 启用Text,显示冷却数字
}
}
7 享受吧!
至此,基本技能图标的冷却效果和时间显示已经完成。为什么不试试看呢?
文章来源:https://blog.csdn.net/zerg_nick/article/details/78203124?locationNum=4&fps=1
感谢您的来访,获取更多精彩文章请收藏本站。
© 版权声明
THE END