最終效果

寒冰法師

火焰法師

素材

https://assetstore.unity.com/packages/2d/characters/gothicvania-church-pack-147117

一、功能分析

實現(xiàn)方法

將序列圖中要發(fā)光的部位單獨(dú)提取出來，進(jìn)行處理完后在覆蓋回原來的圖片
具體的做法就是制作一張黑白的次級圖片，白色的部分是對應(yīng)主圖片中要發(fā)光的部位，黑色部分就是背景

基本思路

1.讓貼圖中讓想要發(fā)出光亮的部分使用一種更明亮的顏色
2.使用Bloom進(jìn)行處理

Unity的Bloom后處理

是一種常用的后處理效果，可以讓高亮區(qū)域的顏色逐漸擴(kuò)散到周圍并使得這些光源散發(fā)出更強(qiáng)烈的亮度，并產(chǎn)生柔和的光暈效果，增加視覺上的對比度和明亮感

為什么關(guān)鍵部位白色？

白色的RGB都是1,1乘任何數(shù)，都會變成那個數(shù)
黑色的RGB都是0,0乘任何數(shù)，都是0

最終結(jié)果

當(dāng)我們處理完黑白次級圖片后，就可以直接將其與主圖片進(jìn)行相加

二、 新建URP項目

如果你的項目默認(rèn)不是URP項目，可以選擇升級到URP，參考：【unity小技巧】為啥我們的模型材質(zhì)顯示粉色？unity普通項目升級URP項目

三、合并圖片

這個主角素材圖片默認(rèn)是分開的，我們先將圖片合并，方便后續(xù)摳圖

在線工具：http://sjli.github.io/spritemaker_extjs/example.html

合并后的圖片

四、使用PS制作黑白圖片

方法一 手動涂鴉

可能精準(zhǔn)但是耗時的方法，推薦用第二種

方法二 魔棒工具

方便快捷的點選方法

1. 拖入圖片進(jìn)PS，選擇魔棒工具，容差設(shè)置為0，取消勾選連續(xù)，點選想要發(fā)光的區(qū)域

2. 如果對一些選擇不滿意，可以點擊添加到選區(qū)，就可以連續(xù)點選不滿意的區(qū)域，如果不小心點錯了，可以按Ctrl+z撤回

最終效果

3. 全部選中后，點擊新建圖層

4. 將原來圖層隱藏

5. 點擊填充

6. 內(nèi)容選白色，點擊確認(rèn)

此時我們選中的部位就被白色填充了

7. 點擊新建選區(qū)，把原來的選擇去掉

8. 選擇填充工具，顏色選黑色，容差設(shè)為0

9. 導(dǎo)出

最終效果

如果你比較懶，可以選擇直接使用我準(zhǔn)備好的黑圖

五、將黑白圖片制作成主圖片的次級紋理

配置

制作成主圖片的次級紋理，命名為_GlowTextures

六、素材默認(rèn)不支持光照，修改材質(zhì)

人物和場景都用這個Sprite-lit-default材質(zhì)，這個材質(zhì)可讓我們的紋理接受光源影響

七、接下來在場景中添加bloom進(jìn)行后處理

讓相機(jī)支持后處理

新建Global Volume全局后處理

添加bloom泛光效果

Threshold(閾值)：控制哪些亮度的像素會受到泛光效果的影響。高于閾值的像素才會產(chǎn)生泛光效果，低于閾值的像素將不受影響。調(diào)整閾值可以控制泛光的出現(xiàn)頻率。一般在0-1之間。簡單說就是這個值越小,就會有更多物體會亮起來,值越大亮起來的物體就越少。一般默認(rèn)填0.9就可以了
Intensity(強(qiáng)度)：控制泛光的亮度增強(qiáng)程度。增加該值會使泛光更明顯，減小該值會減弱泛光效果。這個值可以控制光的亮度，值越大越亮。

八、添加全局2D光源

調(diào)低它的強(qiáng)度，因為我們不想讓這些地面什么的亮起來
調(diào)低強(qiáng)度可以讓這些物體，在Boom的閾值下面，可以讓它們不亮起來，這里設(shè)為0.7了

九、新建受到光源影響的Sprite Lit ShaderGraph

按這個ShaderGraph新增材質(zhì)掛載主角身上，可以看到主角變成了一坨，那是因為我們ShaderGraph還沒有配置材質(zhì)沒有MainTex紋理屬性。

十、配置Sprite Lit ShaderGraph節(jié)點

Sample Texture 2D節(jié)點

接收一個Texture2d類型的輸入，輸出這個Texture2d的RGBA

保存可以看到人物紋理已經(jīng)渲染了

有同學(xué)就會有疑問了，我明明還沒有配置主絕紋理，為啥主角就正常了。其實Unity它會自動根據(jù)這個reference上的值，從我們的精靈中嘗試找到對應(yīng)的紋理，而我們的主紋理里名稱就是這個MainTex，就會自動找到主紋理，但是為了方便測試看到效果，這里我們還是手動配置一下主紋理

添加次級紋理，注意名稱要對應(yīng)，這樣unity就會自動去查找到對應(yīng)次級紋理，記得名稱不需要下劃線

為了方便演示，我們還是一樣手動賦值一個紋理

add節(jié)點

add節(jié)點可以將兩個紋理進(jìn)行相加

我們的主紋理中有部分是透明的，而我們的這個黑白紋理中都是不透明的，雖然我們黑色的部分它的RGB都是O，但它的A是1，當(dāng)我們直接使用這個（黑白紋理的）RGBA和主紋理（的RGBA)進(jìn)行相加時，它的A會把主紋理的A給覆蓋了，這樣就會導(dǎo)致主紋理中的透明度都設(shè)為1了，透明部分都被覆蓋了

我們只想取這個次級紋理的RGB，有一個簡單的方法，就是直接使用其中任何一個通道，這里我們直接使用R通道。
當(dāng)我們使用add的時候，Unity會自動進(jìn)行轉(zhuǎn)換，比如我們R是0，Unity會自動把它轉(zhuǎn)換成RGBA都是0的值，而我們R是1的時候，Unity就會自動轉(zhuǎn)換成RGBA都是1的值

保存，人物項鏈和攻擊波已經(jīng)亮起來了

這是因為白色是個很明亮的顏色，它已經(jīng)達(dá)到了bloom能夠處理的閾值，所以它就被bloom進(jìn)行后處理了，賦予了光源

Multiply節(jié)點相乘

接下來我們添加一個color，使其可以修改我們的光源顏色，將黑白紋理和一個顏色進(jìn)行相乘，達(dá)到修改白色部分的效果，顏色相乘，在Unity中叫做Multiply

可以修改顏色模式為HDR，這樣就可以修改亮度

保存，效果

可以通過修改材質(zhì)配置，修改顏色和亮度

效果

One Minus節(jié)點取反

顏色誤差問題

細(xì)心的同學(xué)可能會發(fā)現(xiàn)，我設(shè)置的顏色和顯示的顏色總是有點誤差，顯示的顏色總是偏淺。

因為修改顏色的原理大致就是修改要發(fā)光部位的底色，而最后加法的最終結(jié)果會受到底色的影響所以是有誤差的

修復(fù)

不過這個問題其實可以通過將次級紋理（如果有多個次級紋理就使用Add節(jié)點把他們加起來之后）使用One Minus節(jié)點得到反相圖，然后和主紋理通過Multiply節(jié)點相乘代替主紋理就可以避免掉這個問題了。

效果

Split節(jié)點 分裂

如果不想Alpha連線太長

可以在最后添加Split節(jié)點，把圖片重新拆分RGBA，再連接

十一、多個次級紋理

如果有其他次級紋理，比如劍光和盾防紋理也是類似配置

然后使用Add把他們相加，最后應(yīng)用到主紋理上

最終效果

shaderGraph最終連線圖

寒冰法師

火焰法師

參考

www.youtube.com/watch?v=WiDVoj5VQ4c
https://www.youtube.com/watch?v=Tm0rRX8GnFk
https://www.bilibili.com/video/BV17x4y1d7om/

源碼

整理好了我再放上來

完結(jié)

贈人玫瑰，手有余香！如果文章內(nèi)容對你有所幫助，請不要吝嗇你的點贊評論和關(guān)注，以便我第一時間收到反饋，你的每一次支持都是我不斷創(chuàng)作的最大動力。當(dāng)然如果你發(fā)現(xiàn)了文章中存在錯誤或者有更好的解決方法，也歡迎評論私信告訴我哦！

好了，我是向宇，https://xiangyu.blog.csdn.net

一位在小公司默默奮斗的開發(fā)者，出于興趣愛好，最近開始自學(xué)unity，閑暇之余，邊學(xué)習(xí)邊記錄分享，站在巨人的肩膀上，通過學(xué)習(xí)前輩們的經(jīng)驗總是會給我很多幫助和啟發(fā)！php是工作，unity是生活！如果你遇到任何問題，也歡迎你評論私信找我， 雖然有些問題我也不一定會，但是我會查閱各方資料，爭取給出最好的建議，希望可以幫助更多想學(xué)編程的人，共勉~