步骤 2 - 将您在第一步中创建的 stencil 应用¶
在此步骤中,您使用渲染通道和 Stencil 节点仅显示 ContactsList 节点的选定部分。
您使用渲染通道首先将 Stencil 节点的形状写入模板缓冲区。然后,您使用模板测试仅将 Stencil 节点覆盖的并且您写入模板缓冲区的 ContactsList 节点的部分绘制到屏幕上。
模板缓冲区是当前帧缓冲区中的一幅图像,您可以使用它来控制 Kanzi 渲染哪些像素。您可以使用渲染通道根据模板缓冲区的值丢弃或渲染内容中的特定像素。通过这种方式,您可以将渲染区域限制为用作模板的节点的形状。节点的形状就像模板中的间隙,决定了内容的哪些部分是可见的。
要应用模具:
在 Library > Rendering 按 Alt 并右键单击 Render Pass Prefabs 中,选择 Group 渲染通道,并将其命名为 Stencil 渲染通道。
使用 Group 渲染通道收集将模具应用到内容的渲染通道。
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道中创建一个 Clear 渲染通道,在 Properties 中添加 Clear Stencil 属性,并将其设置为 0。通过这种方式,您可以将值 0 写入模具缓冲区中的所有像素,从而清除模具缓冲区。在此过程的后续步骤中,您将使用模具缓冲区把渲染区域限制为 Stencil 节点的形状。
在 Node Tree 中选择 RootNode > Viewport 2D 节点,并在 Properties 中将 Render Pass Prefab 属性设置为 Stencil 渲染通道。
通过这种方式,您可以设置 Kanzi 使用 Stencil 渲染通道渲染 Viewport 2D 节点。
Stencil 渲染通道还没有在屏幕上绘制任何内容,因此在 Preview 中 Viewport 2D 节点为空。
向模具缓冲区写入 Stencil 节点的形状:
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道中创建一个 Draw Objects 渲染通道,将其命名为 Draw Stencil,在 Properties 中添加 Object Source 属性,并将其设置为 Stencil Filter Tag Filter。
使用 Object Source 属性仅将您希望 Draw Objects 渲染通道渲染的节点传递给该渲染通道。
在这里,您将 Stencil 渲染通道设置为仅渲染 Stencil 节点。
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道中创建一个 Pipeline State 渲染通道,将其命名为 Stencil Write,并将 Draw Stencil 渲染通道拖到 Stencil Write 渲染通道上。
使用渲染通道写入至模具缓冲区。
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道中选择 Stencil Write,并在 Properties 中添加并设置:
Color Write Mode 到 None
这样即可使 Stencil 节点不可见。
Depth Write Enabled 为禁用。
通过这种方式,您可以防止 Draw Stencil 渲染通道将 Stencil 节点写入深度缓冲区。
Stencil Test Function 到 Always
您使用此属性控制模具测试以何种方式将模具参考值与模具缓冲区中的值进行比较。您将属性设置为 Always 以始终通过测试。
通过这种方式,您可以使 Draw Stencil 渲染通道将 Stencil 节点写入模板缓冲区。
Stencil Function Reference Value 到 1
通过将 Stencil Function Reference Value 设置为 1,您可以使 Draw Stencil 渲染通道以值 1 写入模板缓冲区。
Stencil Pass Depth Pass Operation 到 Replace
通过这种方式,将模板缓冲区中的当前值替换为 Stencil Function Reference Value 属性的值。
将 Stencil Write Enabled 设置为 enabled。
通过这种方式,您将值 1 写入模板缓冲区中 Stencil 节点的形状,并在其他地方保留值 0。
渲染联系人列表:
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道中创建一个 Gather Lights 渲染通道。
使用此渲染通道在使用 Stencil 渲染通道预设件的 Viewport 2D 节点中收集照亮联系人列表的 Light 节点。
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道 > Gather Lights 渲染通道中创建一个 Draw Objects 渲染通道,将其命名为 Draw ContactsList,在 Properties 中添加 Object Source 属性,并将其设置为 Content Filter Tag Filter。
Kanzi 现在渲染 ContactsList 和 Directional Light 节点。然而,Kanzi 不渲染 Stencil 节点,因为 Content Filter 排除了带有 Stencil 标签的节点。
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道中创建一个 Pipeline State 渲染通道,将其命名为 Stencil Test,并将 Gather Lights 渲染通道拖到 Stencil Test 渲染通道上。
在下一步中,您使用 Stencil Test 渲染通道来将 Draw ContactsList 渲染通道的渲染限制在您在此过程的早期写入模板缓冲区的区域。
在 Library > Rendering > Render Pass Prefabs > Stencil 渲染通道中选择 Stencil Test,并在 Properties 中添加并设置:
Stencil Test Function 到 Equal
Stencil Function Reference Value 到 1
通过这种方式,您将 ContactsList 节点的渲染区域限制为具有模板值 1 的像素,从而使渲染过程仅绘制与 Stencil 节点重叠的 ContactsList 节点的部分。
接下来该做什么?¶
在本教程中,您学习了如何将模具应用到 3D 内容,使 Kanzi 仅渲染内容的选定区域。现在您可以:
了解如何使用渲染通道在 3D 内容上应用全屏泛光效果。请参阅 教程:创建一个 bloom 效果。
了解如何使用 List Box 节点创建一个从数据源接收数据的联系人列表。请参阅 教程:使用 Grid List Box 创建联系人列表。。
了解如何在 Kanzi 中定义数据源,并从数据源获取您的 Kanzi 应用程序的数据。请参阅 教程:从数据源获取应用程序数据。
另请参阅¶
要了解有关 Kanzi 中渲染通道的更多信息,请参阅 渲染 (Rendering)。