新規(guī)矩，先上效果圖

? ? ? 第一次發(fā)布文章，文筆不好，還請見諒。

? ? ?最近在學(xué)習(xí)NGUI，雖然已經(jīng)沒多少人用這個框架了，不過個人覺得，既然火了這么久，肯定有他強(qiáng)大之處，所以還是需要學(xué)習(xí)一下，豐富下自己的見識。

? ? 閑話不多說，來正經(jīng)的，今天要做的這個東西個人覺得還是挺有用的，技能冷卻，在許多游戲中都有這個東西的存在，畢竟如果技能沒有冷卻的話，那太恐怖了，降低了游戲的難度，也讓一個游戲沒有那么吸引人。

? ?看著這個名字--NGUI制作技能冷卻效果，看著高大上，其實并沒有什么特別牛逼的地方，只是一些基本的操作和代碼邏輯。下面，進(jìn)入正題。

1.素材準(zhǔn)備

NGUI插件

技能圖標(biāo)

還有蒙版圖標(biāo)

2.原理分析

? ? ? ? 其實吧，這個東西的原理就是一個，技能前面有一層模板，當(dāng)技能在冷卻期間就給他蒙上，然后慢慢的冷卻回來，當(dāng)蒙版完全消失的時候，技能也就完全冷卻了。

3.技能圖標(biāo)和蒙版制作

? ? ? 別的什么都別想，先做好幾張圖片的顯示，這里，樓主是用的是Sprite，制作圖集，然后把技能圖片放在圖集里面，直接引用就好了。

一個Sprite（skillQ）圖標(biāo)，一個label顯示技能按鍵，一個Sprite（CD）顯示蒙版

這里要注意的是各個組件的父子關(guān)系，別弄混，因為我們后面還要用代碼控制我們的技能冷卻效果。

這里選擇圖集和圖集中對應(yīng)的圖片

注意，圖標(biāo)大小什么的我就不說了，每個人都可以自己div,但是，這里要注意的是，我們的組件是有層深度關(guān)系的，Label，我們的QWER肯定是顯示在最上面一層的，不然冷卻的時候都看不見我們的技能鍵，玩家表示很傷。而我們的蒙版應(yīng)該是在技能圖標(biāo)上面，不然怎么蒙住嘛，是吧，所以他們的深度關(guān)系是Depth：Skill(技能圖標(biāo)) < CD(蒙版) < Label(技能鍵label)

上面步驟完成后，是這個樣子的。

4.神奇的屬性

UI Sprite中的屬性列表：

改變Type為Filled，F(xiàn)illDir為Radial360，也就是填充模式，并且為360度填充

結(jié)果就是這樣，蒙版有一部分不顯示了，也就完美得顯示了下面的技能圖標(biāo)。

5.最終代碼制作

腳本是掛載每一個技能圖標(biāo)對象上的，所以sprite是獲取的子對象的。

把keycode設(shè)置成public，讓我們能方便地在unity中修改，冷卻用協(xié)程來協(xié)助，主要是設(shè)置蒙版的fillamount值來改變當(dāng)前技能的冷卻效果。

當(dāng)fillamount為1時，蒙版全部顯示。

fillamount為0時，蒙版全部隱藏。

這里設(shè)置對應(yīng)的按鍵和冷卻時間

最后，文章就到這了，文筆有限，望大家見諒。

歡迎各路英雄互相討論學(xué)習(xí)。