专业的编程技术博客社区

网站首页 > 博客文章 正文

在5.4中制作你的第一个纹理图(在5.4中制作你的第一个纹理图形)

baijin 2024-08-19 11:25:57 博客文章 14 ℃ 0 评论


让我们制作一个生成自定义 UV 检查图案的快速图表。该图表将提供对图块数量、颜色、网格线和箭头的定制。构建该图将探索与纹理图相关的一些核心概念和工作流程。在构建第一个图表之前,查看入门教程会很有帮助。入门指南提供了编辑器的总体概述以及一些有用的一般概念。

使用添加按钮或从内容浏览器的上下文菜单创建一个新的TextureGraph 资源。将新资源重命名为 TG_UVChecker。

保存资产,然后双击它以打开编辑器。

基础方格瓷砖

我们的图案的基础将是一个简单的两两图案,我们可以根据需要重复和编辑。除了提供用户控件之外,我们还想探索一些工作流程,因此我们将从头开始构建这个简单的模式。

*如果您只需要快速检查图案,您可以探索图案节点,其中包含多种标准图案类型的选项

  1. 从节点选项板向下滚动到程序部分,单击并将形状节点拖到图形中。展开节点以查看所有可能的选项

    形状节点
  2. 将形状类型更改为矩形

  3. 单击输出引脚,然后在释放 LMB 时单击拖出一条线。您将获得调色板,输入“tra”,从列表中选择“变换”。形状节点和变换节点将自动连接。

    1. 使用此技术创建节点时,请记住连接将连接到顶部输入值

  4. 单击向下箭头展开变换节点并将覆盖范围调整为 0.5、0.5。调整变换中的覆盖范围会将输入图像(在本例中是一个简单的矩形)缩放到指定值。默认情况下,填充颜色将为空,带有颜色或 alpha 值。如果需要,您可以在详细信息中设置填充颜色。

  5. 从形状节点中拖出第二个变换节点。将第二个变换的覆盖范围设置为 0.5, 0.5,并将偏移设置为 0.5, 0.5。您现在可以最小化变换节点,以便它们占用更少的空间。

  6. 右键单击图形视图,然后通过向下滚动到数学或搜索从菜单中找到添加节点。

  7. 将变换节点的输出值连接到添加 A 和 B。结果将是单个 4 方形棋盘格图块。


    形状节点和变换
  8. 现在我们有了一个检查器构建块,让我们保持图表组织良好,选择所有节点,然后从右键调色板中选择“新评论”。评论框将包含 4 个节点,将评论命名为 CheckerBlock。

    基本检查块

创建分界线

现在我们有了一个基本的检查块,我们希望提供覆盖分割线的功能。我们还想提供控制分割线的厚度和角半径值的选项。
  1. 首先,让我们再次使用形状节点,将形状设置为矩形并将宽度和高度设置为 0.9

  2. 现在我们已经有了一些线条创建的基本结构,我们希望提供一种更简单的机制来调整线条的粗细和角半径。添加一个新的标量节点并将该节点重命名为“Rounded Corners”将该节点连接到形状节点的 Rounding 引脚

  3. 添加变换节点并将重复设置为 2,2

  4. 最后在变换后添加一个反转节点。这将为我们的线路蒙版提供正确的值。

  5. 从厚度值中拖出并在节点列表中搜索乘法,不将 LineMult 输出连接到乘法节点的下部 B 引脚并将值设置为“.1”

  6. 现在我们可以控制圆角大小,我们希望能够轻松控制每个方块之间的线条粗细。我们想要给出一个简单的单个值来调整线条粗细,因此我们将使用一些基本的数学节点来使其易于调整。斯普

  7. 让我们通过创建三个标量节点(名为“Line width”、“SquareBase”和“LineMult”)来开始此操作

  8. 以类似的方式将“减法”节点添加到 Square 基节点,并将乘法的输出连接到减法的 B 值。

  9. 将减法的输出连接到形状节点的宽度和高度值。

创建箭头

现在我们有了棋盘格图案和线条,让我们向棋盘格添加一个最终元素,以便我们可以判断图案的方向,让我们在每个正方形的中心添加一些箭头。
  1. 首先创建两个形状节点并将第一个节点的形状设置为三角形,将第二个节点的形状设置为矩形。调整形状的宽度和高度值,使它们大致代表轴和箭头,您可以稍后调整。

  2. 将变换节点添加到每个形状的输出,然后将变换的输出连接到新的添加节点。选择添加节点后,在预览窗口中单击锁定按钮。即使选择了其他节点,这也会将预览锁定到该节点,从而允许您编辑变换值并仍然看到结果。调整变换,这样你就有了一个漂亮的箭头形状

  3. 现在我们有了单箭头形状,我们想将其转换为标准的 4 方形瓷砖底座。我们可以通过从添加节点的输出中拖出一个变换节点来完成此操作。将重复设置为 2, 2。我们可以看到我们的箭头可能有点大,调整缩放值将缩放每个重复的图块。如果我们将该值设置为负值,它将缩小,导致箭头变小。将值设置为 -.1 以稍微缩小。这暴露了每个图块之间的空白区域。我们需要将其作为一个实体遮罩,通过设置填充颜色,我们在每个图块之间的区域将填充所需的颜色和 alpha 值。单击填充颜色图标并将“A”值设置为 1,默认情况下颜色已设置为黑色。**完成箭头制作后,不要忘记取消选中预览上的锁定,以便您可以看到其他节点预览。

  4. 选择所有节点并在它们周围创建一个新的注释框以帮助组织您的图表

连接组件

现在,我们有了核心构建块来制作可扩展的棋盘格图案,为了使其易于调整以供将来使用,我们希望添加更多类似于网格线部分的控件。
  1. 我们将从最重要的元素(实际的棋盘格颜色)开始,从调色板中拖出或右键单击以创建 2 个颜色节点并将它们重命名为 CheckerColorA 和 CheckerColorB。还要创建一个新的标量节点并将其重命名为 CheckerRepeat。

  2. 将颜色节点调整为所需的棋盘格颜色并将棋盘格重复值设置为 2

  3. 从 CheckerColorA 中拖出并创建一个新的混合节点。混合节点是一个功能强大的节点,具有许多用于复杂混合操作的功能。在这种情况下,我们只保留默认设置

  4. 将 CheckerColorB 附加到背景

  5. 从 Checkerblock 中的添加节点输出中拖出一个新的变换节点。将 CheckerRepeat 的输出连接到重复引脚,单个标量输入将应用于 x 和 y 重复值。现在将变换的输出连接到掩模

我们可以对网格线重复类似的工作流程。我们已经可以控制线条粗细和圆角,但没有线条颜色的设置。
  1. 创建一个新的颜色节点并将其重命名为 LineColor。

  2. 从新的 LineColor 节点中拖出一个新的混合节点。

  3. 将之前的棋盘格混合节点的输出连接到新混合的背景。

  4. 从 GridLines 部分中反转节点的输出添加一个新的变换,将 CheckerRepeat 连接到重复引脚,这与颜色的处理方式完全相同。一个输出可以多次使用。

  5. 将输出连接到新混合的蒙版输入。

  6. 我们将最后一次重复此操作,通过创建一个新的颜色节点,然后创建一个变换和混合节点,将箭头添加到顶部。以类似的方式连接它们。

  7. 最后将最后一个混合节点的输出连接到现有的输出节点。将输出节点重命名为 BaseColorOutput。

输出和出口

除了输出名称、文件夹路径和分辨率之外,输出节点还具有常见纹理属性的设置。
可以将多个输出添加到单个图形中,这在为材质创建更复杂的纹理集(您可能需要颜色、粗糙度、法线和金属贴图)时非常有用。
从我们的网格线变换节点中拖出一个新的亮度和对比度节点并稍微调整设置以创建更平坦的灰度图像。现在从brightnessContrast节点的输出中拖出一个新的输出节点,将名称更改为RoughnessOutput。
按照相同的过程,从网格线中拖出一个新的 NormalFromHeightMap 节点,然后添加一个重命名为 NormalOutput 的新输出节点。
调整每个输出节点的输出名称和压缩设置。
在主菜单栏中,单击“导出”按钮,打开导出窗口,在本例中,它将显示 3 个输出节点作为潜在的输出映射,选择或取消选择这些节点将允许您迭代一个或所有映射如所须。单击此菜单中的“导出”将创建新的纹理贴图
纹理图编辑器可用于各种纹理工作流程,从基本编辑到现有纹理、创建新纹理、打包、图集或与蓝图相结合,纹理图可用作管道实用程序来帮助完成常见流程。请务必查看入门指南和节点参考以查看更多可用选项。
纹理图是一个实验性插件,因此您的输入对于帮助指导开发非常有价值,请继续在专用纹理图线程上进行讨论。


近期焦点

通过游戏动画示例项目获取500多种免费动画
UOD Awards 2024 作品征集,启动!
虚幻引擎5.4现已发布
GDC 2024:来自State of Unreal的重大新闻
欢迎来到全新的虚幻引擎网站
我们将在四月下旬更新虚幻引擎、Twinmotion和RealityCapture的定价




本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表