Demo

使用 Shader Graph 创建交互式顶点效果

MATT SCHELL / UNITY TECHNOLOGIESCollaborator
Feb 12, 2019|6 Min
使用 Shader Graph 创建交互式顶点效果
为方便起见,此网页已进行机器翻译。我们无法保证翻译内容的准确性或可靠性。如果您对翻译内容的准确性有疑问,请参阅此网页的官方英文版本。

我们使用 Shader Graph轻量级渲染管道 创建了一个示例交互式顶点位移效果,以帮助您使用这些功能来设计效果。这篇文章将引导您了解我们的流程。从 3D Game Kit 获取带有 Shader Graph 着色器、示例场景和一些示例游戏资产的 演示项目 ,并继续!

下面视频示例中的球体具有基于着色器的位移效果,当我们按下空格键时就会激活该效果。在您的游戏中,您可以将其分配给某些相关的游戏事件。在本文中,我们将研究如何使用 Shader Graph 包创建此着色器,并集成空格键按键触发器。目标是帮助您了解如何在 Shader Graph 中设计效果,并通过其他 C# 脚本与它们进行交互。演示项目包含着色器、控制着色器的脚本、预配置的轻量级可编写脚本渲染管线 (LWRP) 资源以及供您入门的示例场景。如果您希望以视频而不是文本的形式观看本教程,您可以在 Unity YouTube 频道上找到它。

安装 Shader Graph 和 LWRP 软件包

首先,让我们看看如何设置 Shader Graph 和轻量级渲染管线。 打开包管理器并选择在 Lightweight RP 包上安装。这将自动安装正确版本的 Shader Graph。

图像

一旦安装了 Lightweight RP,我们就需要在项目中创建一个新的 Pipeline 资产。选择创建->渲染->轻量级渲染管线资产。

然后,我们可以通过前往“编辑”->“项目设置”->“图形”,并将 LightweightRenderPipelineAsset 拖到“可编写脚本的渲染管道设置”字段来激活该管道资产。如果您正在关注下载的资产,则此步骤已经为您完成。

图像

现在已经安装了轻量级渲染管线,我们可以创建一个新的着色器视图。让我们通过选择 Create->Shader->PBR Graph 在我们的项目中创建一个新图形。PBR Graph 允许我们创建一个新的着色器,该着色器从 Unity 的基于物理的渲染系统获取输入,以便我们的着色器可以使用阴影和反射等功能。创建此着色器后,我们将其添加到新材质中,然后将材质拖放到球体上,从而将材质附加到示例场景中的球体上。

使用 Shader Graph 进行顶点位移

为了实现该效果,我们将通过改变 PBR Master 输出节点中的输出位置来沿网格法线移动网格中的顶点。我们将通过在每个顶点的基础对象位置上使用添加节点来进行置换。通过将法线矢量添加到基本对象位置,我们可以看到所有顶点都被挤压,使得球体看起来更大。为了改变这个位移,我们将使用简单噪声节点半随机地乘以这个法线矢量位移。

图像

当我们单击“保存资产”时,我们可以在“场景视图”中看到球体现在根据“简单噪声”发生了位移。

图像

不幸的是,由于简单噪声是基于 UV 空间进行采样的,因此位移中存在接缝。为了通过使用简单噪声的对象空间而不是 UV 空间来修复接缝,我们可以简单地添加一个设置为对象的位置节点。

图像

为了创建脉动效果,我们将通过将此位置输出添加到时间节点来滚动它,然后将其发送到简单噪声节点。我们还可以使用“时间”节点的“乘法”来改变滚动的速度。

图像
在 C# 中控制 Shader Graph 属性

为了控制位移,我们在着色器视图中公开了一个新的着色器属性。着色器属性允许我们通过在检查器中输入的值或通过我们自己的 C# 脚本(如本例所示)为着色器提供输入。我们将创建一个名为 Amount 的新 Vector1 属性,并将引用更改为 _Amount。引用字段是字符串名称,我们将通过脚本访问和更改位移。如果我们不改变这一点,它将使用自动生成的值。如果字符串不完全匹配,我们将无法通过脚本处理我们的属性,因此请仔细检查两者是否匹配,包括大写字母。

图像

在将其与法线向量相乘之前,我们在 Multiply 节点中将此 Amount 着色器属性与 Simple Noise 结合使用。这使得我们能够在将噪声应用到顶点位置之前对其进行缩放。现在,Amount 变量控制着网格中每个顶点的位移量。

图像

为了控制这个 Amount 变量,我们创建了一个名为 DisplacementControl 的 C# 脚本并将其附加到 DisplacementSphere GameObject。该脚本通过与我们在材质中创建的分配给 MeshRenderer 组件的属性交互来控制 _Amount 变量。我们在变量 meshRender 中存储对 MeshRenderer 组件的引用,并声明一个新的浮点变量 DisplacementAmount。

我们在 Update 函数中使用一个简单的 lerp 将 DisplacementAmount 变量插入为 0 的值。然后我们将着色器变量 _Amount 设置为存储在 DisplacementAmount 变量中的值。这将更新 Shader Graph 的 _Amount 变量,并随着时间的推移将其平滑至 0。

图像

我们使用 Unity 默认的“跳跃”输入轴(默认分配给空格键)在按下时将 DisplacementAmount 的值设置为 1。

图像

现在,当我们进入场景中的播放模式时,我们可以看到,通过按空格键,displacementAmount 被设置为值 1,然后慢慢插回到 0。

使用 Shader Graph 创建 Voronoi 发光效果

为了创建可调节的发光效果,我们将输出到 PBR Master 节点中的 Emission。我们使用 Voronoi Noise 节点并将其与 Color 节点相乘。这会在发光效果中产生一些带有暗点的调制。然后,我们使用一个 Lerp 节点,以另一个 Color 节点作为基色,并使用 T 输入中的 Amount 变量。这将允许我们使用 Amount 变量在基本 Color 节点和 Voronoi Noise 颜色节点之间进行混合。

图像

然后,我们将使用与之前类似的设置来滚动辉光。我们使用设置为 Object 的 Position 节点并将其添加到 Time 节点,然后将输出连接到 Voronoi Noise 节点的 UV 槽。

图像
图像
图像