MMD联动Unity学习笔记 Vol.17 ShaderGraph入门

前言

    这期我们继续研究ShaderGraph。ShaderGraph是一种网状节点结构图表，它简化的方式取代了手动输入代码。它同样可以当成我们写的CG或HLSL创建的程序来告诉GPU，我们如何改变在屏幕上的材质渲染。

       现在着色编辑器或者ShaderGraph（随便你想怎么称呼）窗口大多是灰色的空白工作空间，我们将用线连接的方式来建立这些着色器变量节点，节点的每一个不能包含一个资源或一个操作符，足够的节点结合一定逻辑功能，你可以用它们来制作一个Shader，理所当然因为我们把它放到一张图表里，所以我们把它称为ShaderGraph。每一个ShaderGraph服务做为着色器输出或者Master节点，决定在一个单独的节点上，现在我们使用一个PBRGraph，所以你将在这个图表类型会一直看到一个标记PBR Master的节点。

    在附加显示的着色编辑器，它自身有一组浮动UI元素，在旁边这里有一个托盘，它称作黑板，通常它可以显示公共暴露属性，我们将使用它来和Unity编辑器传递数据，它允许着色器在检查器的内外部获得数据。

    在这里有另一个浮动的UI，我们有一个可以展示你的着色器的原形或自定义网格的顶部Master节点预览。在你应用修改时，这个图表框架可以马上给你实时反馈，使着色器创建过程相当自然。当然这是一个完成的着色器。那么一个还未完成的着色器呢，当你打开一个全新的着色器，比如我们刚刚创建的这个高光着色器，你将得到一个像这样的有点浅色的东西，再次我们在着色器编辑器有同样的UI元素，我们有黑板，Master节点预览。我们以一个单独的PBR主节点开始编辑。这个着色器图表窗口，它本身与Unity的其它窗口相似，你可以将它嵌入主Unity的窗口布局中，或者只是将它保持浮动窗口的状态，这都决取于你的想法。

    我将嵌入在Game窗口的上面，有需要时我们在窗口标签的上面的目录窗口，在任何时候都可以将它最大化，或者你可以使用Shift+空格键来开关当前聚焦窗口最大（小）化，当你想要向后和前跳转，编辑着色器图表的话，看到多层视窗层布局，来看到你的场景中的着色器的最终效果，它用起来是相当方便地。

    现在我们回到着色器编辑器，我们始终从一个标签为PBR的主节点开始编辑，它是主节点或者输出节点，我们准备增加更多节点到我们的图表里，它们将过滤到这个节点，成为着色器的最终结果。

    你可以使用鼠标中键来导航工作空间（与VEG相同操作），通常的拖动和平移视窗周围。

我们滚动鼠标中键滚轮可以放大缩小图表工作空间，如果你在工作区域中迷失了。

你可以按A键把所有的节点显示在屏幕里，或者你可以按F键来显示你选中的图表中的指定部分，所以你可以选择一个节点或者多个节点时，按F键后就可以在工作区域中将它们全部显示出来。

当我们用鼠标中键平移工作区域时，黑板和预览窗口UI元素是不会移动的，但你可以用鼠标拖动它们的标题栏来移动它们。我们可以看到许多节点都有一个小的插入符号来显示和隐藏预览缩略图，如果节点有这种符号，我们可以点击符号开关预览显示。

    现在我们打开一个最基本的高光着色器图表，你可以注意到PBR主节点，在旁边有一些小圆形图标，这些圆点称为Ports（端口），它们代表可以将节点连接到一起。

每一个端口通常参考一些可以允许输入或输出的节点类型，因为这是主节点，端口涉及许多最终属性，我们可以看到最终材质，对你来说许多名称将看起来很相似，这里有一些额外的端口，比如位置和Alpha剪辑阈值，但是其它的端口只能从通过材质获得才能工作，比如Albedo，Normal，Emission，Metallic，Smoothness，Occlusion和Alpha，所有这些的关联都取决于你在检查器看到属性，每当你看到一个使用Standard着色器的材质时，我们程序上修改着色器图表将改变这些属性，并且影响材质在屏幕上如何渲染。

    现在我们只创建一个实心颜色的最简单的着色器，如果你点击Albedo端口旁边的颜色条，你可改变着色器基本的颜色，我可以将它改为一个不错的着色器，如果你取消最大化窗口来看到结果，你可以注意到没有任何改变，材质预览窗口在检查器里显示一个灰色的球体，这是因为改变需要保存到着色器图表，它们才能产生效果。

    所以让我们点击ShaderGraph左上角的Save Asset（保存资源）按钮，现在蓝色将立即显示在着色器上。

    如果你我们的高光材质标记（拖动）到安全帽物体，你可以看到安全帽变为蓝色，这就是我们创建的最简单的着色器。

    它现在还不实用，除非你需要将你的游戏对象涂成特定蓝色着色器，如果你观察到检查器，你将看到我们完全没有对安全帽的着色器和材质的进行任何调整，我们不能真正控制材质或着色器的颜色或者真正任何属性，最低限度它在允许用户决定它使用何种颜色渲染物体才会更加有用。这里我们就需要使用黑板。

让我们再次最大化着色器编辑窗口，代替手动编程，我们给Albedo属性输入颜色，我们相要让使用者获取颜色，我们在PBR主节点外面创建我们第一个节点，UI允许你用很多不同的方法来创建节点，第一种方法就是在工作区域右键单击鼠标，选择Create Node（创建节点），你可以看到界面，选择创建节点对话框，进而选择里面的各种节点。

你也可以在空白工作区域按空格键，也可以打开创建界面，得到相同创建节点对话框，这些节点被分配到不同的组里面，你需要花点时间找到它们，我建议你花一些时间来试试，简单探索一下对话框的内容。

现在给你第一个小挑战，你可以定位一个让你产生一种特定颜色的节点，选择它连接输出到主节点。

    我们只需要一个选择决定好的颜色的节点，并且你需要会使用，组是如何组织创建节点对话框的，你可以在Input>Basic>Color里面找到它，输入节点允许你给着色器图表一些输入信息，这里我们想要一个特定的颜色，如果我们选择颜色，它可以在工作区域中放出一个颜色节点，我们可以用鼠标左键任意拖动它，如果你意外创建了一个节点，或者你不再需要它，你可以右键点击节点选择Delete（删除）。我们可以在顶部的对话框中，使用搜索关键字的方式来寻找过滤我们想要的节点，这里我们假设想要的节点是颜色，我们就在顶部输入Color，我们就可以搜索到带有color关键词的节点。

    我们将颜色节点拖到工作区域中，我们可以点击颜色带选择想要的颜色，我们选择红色着色器替代默认的黑色。

我们将Mode从Default（默认）切换到HDR，如果我们不需要设置高动态范围，就让我们把它设置为默认模式。现在我们有了一些颜色数据节点，我们想要把它发送主节点的Albedo属性里，我们点击颜色右侧的Out端口圆点，将它连接到主节点Albedo。

连接后我们的颜色节点就替换掉了Albedo的颜色条，我们改变节点颜色后，主节点预览缩略图同样也会产生改变。但如果你再次回到主场景，你不会看到着色器图表的结果，你必须要先保存图表才能看到结果。

现在我们该让黑板发挥作用了，我们可以将颜色节点转换为一个属性，我们将它公共化并暴露到检查器里，我们在颜色节点中右击，选择Convert to property（转换为属性）。

接着我们的节点不能直接编辑颜色了，在黑板里出现一个叫做Color的暴露的属性，你可以打开左侧的小箭头展开显示，你可以看到颜色属性具有所有你在设置颜色节点时的数据，我们可以决定是否将属性暴露到检查器里，我们可以在Reference得到一个特定的ID，有需要的话可以在这里输入一些属性有关的特性特征，让它可以便于识别和使用，下面还有颜色条用来设置颜色，我们点击保存资源。

回到主场景中，可以看到颜色属性已经暴露给检查器，着色器变得更加易用，这样在检查器里面我们就可以任意改变着色器的颜色了。

这个相当于用ShaderGraph写出的“Hello World”。