技能的使用,在很多的游戏里面都会有用到,比如RPG游戏,MMORPG,Moba游戏等,都会用到技能,那么有技能,就一定会有技能的使用,有技能的使用,就一定有技能的冷却。然后UI它的作用就是为了让玩家有直观的了解,对这个技能,比如它的冷却周期,目的就是为了让玩家知道,我们还有多久就可以再次放技能了。所以技能冷却UI非常重要。

技能冷却需要用UI来做,我们在画布上面创建一张image,然后再给image来一张子image,然后我们需要知道的是,技能的冷却,绝大部分的冷却UI显示都是360度填充的,是吧,当然也有少数其他的显示。效果都一样。那么我们就以360度填充为例,来做一个技能冷却UI。首先,我们需要了解一些基础,比如图片有哪些类型,iamge上的一些属性,你是不是都懂,都理解了。如果不知道,那么这个效果,你做起来就比较困难了。在这里我们知道一个点,那就是图片的四种类型,普通类型,九宫切图,平铺,填充。一般情况,我们做UI都是有第一种类型,那么像这次这个技能冷却,我们很明显不好弄,那么就要想别的方法了,这里很明显我们需要用到填充。




Unity 图片在苹果手机上变糊 unity ui图片_Unity 图片在苹果手机上变糊


所以我们按照图上的操作,然后就可以来写代码了,我这里是逆时针旋转填充的,问题不大。这个没影响。然后填充的关键就是那个fallamount,我们需要知道技能的冷却时间,然后需要用计数器。最后来得到当前冷却了多久了,占比总的时间的比重,然后归一化赋值给fallamount就可以了。这里不再细说,直接上代码了。


Unity 图片在苹果手机上变糊 unity ui图片_代码更换ui图片_02


这就是整个的技能冷却UI的案例了,不喜勿喷哦!