手機站首頁散文詩歌雜文隨筆日記小小說

散文網(wǎng) » 游戲 »單機游戲 » Visual Effect Graph初步探索

Visual Effect Graph初步探索

2019-01-18 19:28 作者:皮皮關(guān)做游戲 0人讀過 | 我要投稿

作者：沈琰

本篇難度:★★★☆☆

前言

不久前Unity官方發(fā)布了新版的粒子特效編輯組件:Visual Effect Graph的演示視頻,其中酷炫的效果非常吸引眼球:

我按捺不住濃濃的好奇心，初步了解了一下?，F(xiàn)在把一些自己使用過程中的心得和遇到的問題一并分享給大家，希望能給感興趣的小伙伴一些參考。

安裝

想要使用Visual Effect Graph（以下簡稱VEG），Unity的版本不能低于2018.3,并且目前VEG僅支持HDRP(High-Definition Render Pipeline,高清晰渲染管線),所以除了VEG的安裝包外還需要另外三個HDRP相關(guān)的安裝包作為其支持:

這里可以選擇在PackageManager中直接安裝。如果網(wǎng)速不給力,也可以直接下載官方GitHub上的安裝包,然后手動導入。

傳送門：https://github.com/Unity-Technologies/ScriptableRenderPipeline/tree/release/2018.3

下載下來后，在PackageManage中點擊添加按鈕,然后在路徑中找到安裝包文件夾內(nèi)的json格式文件,點擊導入。

經(jīng)過一段時間的等待導入后，準備工作就基本完成了。

新建

現(xiàn)在開始創(chuàng)建我們的第一個Visual Effect特效。如果之前的安裝包導入正確，那么在Hierarchy面板上直接可以點擊右鍵創(chuàng)建一個Visual Effect對象。

然后在Project面板上新建一個VEG,拖入Visual Effect面板上的Asset Template中,點擊Edit,就可以開始進行編輯。

VEG的工作流程

進入VEG的編輯界面，首先映入眼簾的是由四個大方塊組成的一個默認的流程模板：

VEG的編輯方式類似于ShaderForge,由各個Block之間進行連線操作完成編輯，全程不需要編寫任何代碼。

而每個流程（在VEG中稱為context）包涵多個不同的Block,的整個VEG的工作流程被抽象為4個部分：

Spawn

負責生成粒子,右鍵點擊添加的Block都是與粒子生成相關(guān)。類比之前的粒子系統(tǒng)，這個流程就是模擬的發(fā)射器模塊。

Initialize

初始化模塊，負責初始化粒子的屬性，如初始速度，生命周期等。

Update

每幀對粒子的參數(shù)進行更新，比如重力、移動速度，坐標等。

OutPut

主要負責粒子的渲染，如顏色、形狀等。

每個context所連接的并非唯一,比如一個Spawn可以連接多個Initialize,朝多個不同的方向發(fā)射粒子。

總得來說VEG使用起來還是比較容易，其設計相當符合人的直覺，如果之前就對ParticleSystem的操作比較熟悉的同學很快就能上手。

每個context能附加的Block非常多,可以以此實現(xiàn)相當酷炫復雜的效果。

不過也正因為如此，以文章的篇幅沒法每個Block都詳細介紹，所以下面就以一些個人覺得比較重要的功能結(jié)合實際的例子簡單說明一下VEG的使用方法。

重點與實例

1.Vector Field與Signed Distance Field

個人覺得除了渲染計算方式不同以外,VEG區(qū)別于ParticleSystem最大的特點,是新特性Signed Distance Field(有向距離場)和Vector Field(矢量場)的加入。具體的應用如同開頭演示視頻里的截圖，可以讓粒子填充出一個具體的形狀,或者是讓粒子沿著矢量場的方向運動:

不過這里有一個問題,目前Unity還沒有內(nèi)置的有向距離場和矢量場的編輯工具,已知的外部編輯軟件編輯出來的資源似乎也沒辦法直接轉(zhuǎn)換成Unity能夠識別的格式。

未來Unity可能會添加編輯工具或者插件,但就目前來說暫時很難通過自制獲取此類資源,不過這并不妨礙去了解使用方式。

打開編輯界面，先用一個簡單的球狀發(fā)射器發(fā)射一些粒子，然后在Update中新建一個block“Vector Field Force“。在Vector Field字段中會有一張默認的矢量場圖片,我們來觀察一下默認矢量場是個什么形狀:

似乎就是一個均勻的渦流狀矢量場,看不出什么名堂。

再如法炮制一下，新建一個block“Comform to Signed Distance Field”,觀察默認的有向距離場形狀。這個倒是可以看出來是一個挺明顯的神燈(茶壺)形狀。

當以后如果有了較為方便的編輯工具后，就可以用自定義的資源實現(xiàn)一些酷炫的效果。

不過對于子現(xiàn)在就等不及，已經(jīng)饑渴難耐的同學也不是完全沒辦法,參考這里:?https://zhuanlan.zhihu.com/p/49301381

2.Point Cache bake tool(點陣緩存烘培器)

雖然有向距離場和矢量場暫時沒辦法自定義編輯，但是Unity內(nèi)置了另外一個小工具：Point Cache bake tool:

2018.3以上的Unity版本中,windows-- effects--utilities選項卡里可以找到

它的作用是把一張Textrue或者一個Mesh的信息,烘焙成一張點陣圖導入VEG中使用,可導入的信息包括顏色、法線、UV信息等等。

具體有什么用呢？舉個例子。

在網(wǎng)上隨便下載一張圖片，導入到Unity里用,剛才的工具進行烘培,得到了這么一個資源文件:

然后就可以在VEG里使用了。

首先在VEG編輯界面的空白區(qū)域新建一個點陣緩存節(jié)點，并把剛才烘培好的資源拖進去：

然后讓粒子生成的位置和顏色應用這張點陣圖的數(shù)據(jù)：

最后讓粒子一段時間后自動消散，大概是這么一個效果：

同理，不止是圖片，Mesh信息也能如此運用到VEG中:

3.VFX Binder腳本,參數(shù)與事件的綁定方式

編輯VEG時,可以在BlackBoard上新建參數(shù),選中Exposed框,并暴露到Insceptor面板上。然后通過調(diào)整參數(shù)就可以修改Visual Effect的某些屬性,比如顏色,大小等等。

但這僅能在編輯模式中調(diào)整，有沒有辦法在游戲運行的時候根據(jù)游戲內(nèi)的邏輯來實時動態(tài)改變Visual Effect呢？

既然我都這么問了那自然是有的，在VEG的安裝包里內(nèi)置了一些VFX Binder腳本的模板:

這些腳本的作用就是將外部參數(shù)與VEG界面里的參數(shù)綁定，可以看到能綁定的數(shù)據(jù)大致能分為兩類:參數(shù)（Parameter）和事件(Event)。

參數(shù)綁定

參數(shù)就是類似坐標,方向,速度之類的信息。只要API支持的數(shù)據(jù)格式，即便預制模板腳本內(nèi)沒有，也可以依葫蘆畫瓢仿照模板去編寫腳本。支持的類型如下圖：

舉個例子，現(xiàn)在要讓Visual Effect生成的粒子去填充一個球體，但讓這個球體在游戲運行時遵循物理引擎運動。

新建一個Shpere并添加剛體,刪除renderer組件，也就是說創(chuàng)建一個只有物理碰撞卻看不見的隱形球體，然后用Cube在場景中搭建一個框作為球體的托盤。

在VEG編輯界面新建一個Sphere類型的參數(shù),復選暴露到Inspector中。

新建一個Visual Effect，并添加VFX Sphere Binder腳本。將剛才創(chuàng)建的Sphere拖入腳本的Target欄中,并保證Parameter的名字與暴露出的參數(shù)名相同。

如此一來場景內(nèi)Sphere的數(shù)據(jù)就與VEG內(nèi)的參數(shù)綁定了,就可以拿著這個參數(shù)作為填充球的數(shù)據(jù)了。

再去寫個簡單的腳本讓底座左右擺動，運行效果如下：

事件綁定

不僅參數(shù)可以通過腳本傳遞綁定，粒子的觸發(fā)事件也能。在VEG里事件作為一個單獨的Context,不能附加任何Block并且只能與Spawn相連,作用是管理Spawn的發(fā)射開關(guān)。

通過C#腳本綁定傳遞事件并非只是傳遞了事件本身,也可以附帶一些參數(shù)。以內(nèi)置的VFX Mouse Event Binder腳本為例。

通過閱讀代碼,可以看腳本中把鼠標點擊的坐標以EventAttribute作為載體傳遞到了Visual Effect對象里:

? ? ? ? [Tooltip("Computes intersection in world space and sets it to the position EventAttribute")]

??????? public bool RaycastMousePosition = false;

?

??????? protected override void SetEventAttribute(object[] parameters)

??????? {

??????????? if (RaycastMousePosition)

??????????? {

??????????????? Camera c = Camera.main;

??????????????? RaycastHit hit;

??????????????? Ray r = c.ScreenPointToRay(Input.mousePosition);

??????????????? if (GetComponent<Collider>().Raycast(r, out hit, float.MaxValue))

??????????????? {

??????????????????? eventAttribute.SetVector3(position, hit.point);

?????? ?????????????

??????????????? }

??????????? }

??????? }

這個時候問題又來了，事件附帶的參數(shù)該如何獲取和使用？

一開始以為直接從Event連接的Spawn中創(chuàng)建Block指定坐標就行,但試來試去都沒有效果,最后又去仔細了的看了下官方文檔,最后找到了方法:

簡單來說就是通過Get Attribute這個Block,根據(jù)Location的不同,可以獲取當前每個粒子模擬的參數(shù),或者是由EventAttribute附帶傳遞進來的的參數(shù),并且Location為Source的Attribute只能用在Initializes中的Block上:

知道怎么用以后就可以試試做個鼠標點擊發(fā)射粒子的效果。

再新建一個Visual Effect,然后新建一個Plane作為腳本載體,把新建的Visual Effect拖入腳本中:

然后在VEG里新建一個Event,注意名字要與腳本上的EventName一一對應,然后連接到Spawn上:

最后獲取鼠標點擊的坐標,連接到Initializes里的Set Position上:

最后運行效果如下:

這樣相當于是可以通過鼠標點擊控制粒子的發(fā)射位置。內(nèi)置腳本里還有一個獲取碰撞事件和碰撞點的例子，如果有需要也可以參照這個格式自定義腳本。

更為詳細的說明參考官方文檔：https://github.com/Unity-Technologies/ScriptableRenderPipeline/wiki/VFX-Attributes-Properties-and-Settings

4.VEG動畫效果

動畫效果本質(zhì)上就是一個或多個隨時間變化的參數(shù)作用在物體上，所以實現(xiàn)動畫效果的關(guān)鍵在于獲取時間變化的量。

在之前版本的ParticleSystem中,似乎沒有能單獨獲取游戲運行時間的方法。粒子的動畫效果是通過類似Color Over LifeTime之類的模塊,根據(jù)粒子的聲明周期實現(xiàn)一個隨時間變化的效果。

這個思路是符合ParticleSystem的設計思路的，因為在每個粒子初始化時必須指定它的LifeTime。

但是在VEG中，粒子的運行周期被抽象化了，在Initializes中可以沒有Set LifeTime這個模塊,也就是說粒子是永遠存在的。在這個時候再想實現(xiàn)動畫效果就得獲取一個跟粒子生命周期無關(guān)的時間變量。

VEG中獲取時間的節(jié)點有三種：

其中Total Time(Per-Particle)與TotalTime的區(qū)別是:前者在獲取時間變量時會根據(jù)每個粒子在當前幀個下一幀的不同時間進行單獨計算。假如使用時間變量讓發(fā)射器周期移動，在速度較快的情況下，后者會在移動路徑上顯示一個離散的好似殘影的效果。而如果是前者作為參數(shù)，會因為單獨計算每個粒子的時間的緣故，讓路徑軌跡得到一個類似插值計算的平均化的軌跡。

直接說有些抽象，用一個實際例子來說明一下。

新建一個Visual Effect，實現(xiàn)一個讓三個發(fā)射器互相旋轉(zhuǎn)糾纏的偽·三體運動，用不同的時間節(jié)點作為輸入?yún)?shù)對比。