材质编辑器 - 如何产生 UV 坐标动画

为材质添加运动的能力不可或缺,当您尝试重新创建诸如火焰、流水或烟雾之类的效果时尤其如此。 在虚幻引擎 4 (UE4) 中,实现此功能的一种低成本、有效方法是使用 平移(Panner)材质表达式 节点。 “平移”(Panner)材质表达式节点允许沿 U 或 V 方向或者同时沿这两个方向移动纹理的 UV 坐标。

什么是 UV 坐标动画

UV 坐标动画或 UV 平移的含义是,水平 (U) 和/或垂直 (V) 移动纹理的 UV 坐标,以产生复杂动画的错觉。 在以下示例中,火焰纹理沿着 U(水平)方向平移,使火焰看起来像是在移动一样。

“平移”(Panner)节点明细

下图是“平移”(Panner)节点添加到材质图之后的外观。 “平移”(Panner)节点有两个输入,即“坐标”(Coordinates)和“时间”(Time),并输出结果。 您可以通过在 选用板 中搜索 Panner,或者在鼠标位于材质图窗口内时按键盘上的 P 键,将“平移材质表达式”(Panner Material Expression)节点添加到材质图。

AU_Node_Breakdown.png

属性

说明

坐标(Coordinate)

接收可以通过表达式来修改的基本 UV 纹理坐标。

时间(Time)

接收用来确定当前平移位置的值。这通常是用来提供常量平移效果的时间表达式,但是,也可以使用常量或标量参数来设置特定偏移,或者通过 Matinee蓝图来控制平移。

AU_Node_Options_Breakdown.png

属性

说明

速度 X(Speed X)

纹理坐标沿水平或 X 轴方向移动的速度。

速度 Y(Speed Y)

纹理坐标沿垂直或 Y 轴方向移动的速度。

常量坐标(Const Coordinate)

仅在未连接坐标的情况下使用。

小数部分(Fractional Part)

仅输出平移计算结果的小数部分,以提高精度。输出将大于或等于 0 并且小于 1。

如何在材质中使用动画 UV 坐标

设置纹理以使用 UV 平移功能的步骤如下。

本教程将使用项目中包含 起步内容 时可以找到的内容。如果您的项目未包含起步内容,请参阅 迁移 内容页面,以了解有关如何在项目之间移动内容的信息。通过这种方法,您可以将起步内容添加到项目中,而不必建立新项目。

  1. 首先,在 内容浏览器 中创建新材质。为此,请在 内容浏览器右键单击,从 创建基本资产(Create Basic Asset)菜单中选择 材质(Material),然后将它命名为 Panner_Material。 完成后,内容浏览器 中应该会显示类似下图的内容。

    AU_Creat_New_Material.png

  2. 材质现已创建完毕,请在 内容浏览器 中通过 双击鼠标左键 将其打开。打开材质之后,返回到 内容浏览器 并单击 Game 文件夹,然后搜索 T_Fire_Tiled_D 一词以查找火焰纹理。

    AU_Find_Fire_Texture.png

  3. 找到火焰纹理后,通过以下方法将它从 内容浏览器 拖到材质中:使用 鼠标左键 将它选中,然后按住 鼠标左键 将它拖到材质中。当鼠标指针位于材质上时,释放 鼠标左键 即可将纹理放入材质图。

  4. 纹理现在已放入材质图,请转到 选用板 并搜索 Panner。找到 平移(Panner)材质表达式后,请使用 鼠标左键 将其选中,然后将它拖到材质图中。当鼠标指针位于材质图上方时,释放 鼠标左键 即可将 平移(Panner)材质表达式放入材质图。完成之后,您的材质图应该类似于下图。

  5. 现在,您已添加了所需的所有节点,可以开始将它们连接到一起。首先,将火焰纹理的 白色 输出连接到 底色(Base Color)输入。然后,将 平移(Panner)的输出连接到火焰纹理的 UV 输入。完成后,您应该看到类似下图的内容。

    AU_Making_Connections.png

  6. 所有内容现已连接完毕,可以开始让火焰纹理平移。为此,请先选择 平移(Panner)材质表达式,然后在 细节(Details)面板中,将 速度 X(Speed X)参数设置为 0.1AU_Set_Panning_Speed.png

  7. 速度 X(Speed X)设置为 0.1 时,在预览窗口中,您应该会立即看到火焰纹理开始水平移动。

  8. 现在,可以编译、保存和使用此材质。

提示与技巧

将平移功能与其他材质表达式结合使用是一种很不错的方法,这样可以添加一些额外的控制来确定平移的工作方式。 在以下示例中,将对上文创建的材质进行进一步处理,即,添加控制项以帮助控制速度及平铺。 通过增大 材质坐标(TexCoord)时间(Time)材质表达式的乘数,您可以调整火焰纹理的速度及平铺。

AU_Adding_More_Controal.png

您也可以叠加 平移(Panner) 材质表达式,以产生更加复杂的移动错觉。 在本示例中,通过先选中所有材质表达式节点再按键盘上的 CTRL + W,创建所有原始材质表达式节点的副本。 然后,将新建节点的平移方向从 速度 X(Speed X)= 0.1 更改为 速度 Y(Speed Y)= 0.1 以使图像垂直移动,而不是水平移动。 接着,将与 时间(Time)纹理坐标(TexCoord)相乘的值从 1 增大为 2。 最后,这两个纹理 相乘 以产生以下最终结果。

结论

UV 坐标动画是一种可以为材质引入运动效果的出色方法。 对于需要复杂运动的视觉效果(如烟雾或火焰),这种方法也极为有用。 但是,请记住,UV 坐标动画最适合于具有连续 UV 设置的对象。 网格 UV 坐标中的任何偏差在 UV 坐标动画时都会显现。