步骤 2 - 将您在第一步中创建的 stencil 应用

在此步骤中,您使用渲染通道和 Stencil 节点仅显示 ContactsList 节点的选定部分。

您使用渲染通道首先将 Stencil 节点的形状写入模板缓冲区。然后,您使用模板测试仅将 Stencil 节点覆盖的并且您写入模板缓冲区的 ContactsList 节点的部分绘制到屏幕上。

模板缓冲区是当前帧缓冲区中的一幅图像,您可以使用它来控制 Kanzi 渲染哪些像素。您可以使用渲染通道根据模板缓冲区的值丢弃或渲染内容中的特定像素。通过这种方式,您可以将渲染区域限制为用作模板的节点的形状。节点的形状就像模板中的间隙,决定了内容的哪些部分是可见的。

要应用模具:

  1. 在 Library > Rendering 按 Alt 并右键单击 Render Pass Prefabs 中,选择 Group Render Pass,并将其命名为 Stencil Render Pass。

    您使用 Group Render Pass 来收集在内容上应用模板的渲染通道。

    ../../_images/create-group-render-pass1.png ../../_images/stencil-render-pass-in-library.png
  2. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass 中创建一个 Clear Render Pass,在 Properties 中添加 Clear Stencil 属性,并将其设置为 0。这样,您可以通过将值 0 写入模板缓冲区中的所有像素来清除模板缓冲区。在此过程中,您稍后会使用模板缓冲区来将渲染区域限制为 Stencil 节点的形状。

    ../../_images/clear-render-pass.png ../../_images/clear-render-pass-clear-stencil-set-to-0.png
  3. 在 Node Tree 中,选择 RootPage > Viewport 2D 节点,并在 Properties 中将 Render Pass Prefab 属性设置为 Stencil Render Pass。

    通过这种方式,您可以设置 Kanzi 使用 Stencil Render Pass 渲染 Viewport 2D 节点。

    Stencil Render Pass 还没有在屏幕上绘制任何内容,这就是为什么在 Preview 中 Viewport 2D 节点是空的。

    ../../_images/scene-in-project.png ../../_images/scene-set-render-pass-property.png
  4. 向模具缓冲区写入 Stencil 节点的形状:

    1. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass 中创建一个 Draw Objects Render Pass,将其命名为 Draw Stencil,在 Properties 中添加 Object Source 属性,并将其设置为 Stencil Filter Tag Filter。

      使用 Object Source 属性仅将您希望渲染的节点传递给 Draw Objects Render Pass。

      在这里,您将 Stencil Render Pass 设置为仅渲染 Stencil 节点。

      ../../_images/draw-stencil-in-library.png ../../_images/draw-stencil-properties.png ../../_images/stencil-in-preview.png
    2. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass 中创建一个 Pipeline State Render Pass,将其命名为 Stencil Write,并将 Draw Stencil 渲染通道拖到 Stencil Write 渲染通道。

      使用渲染通道写入至模具缓冲区。

      ../../_images/stencil-write-created-in-library.png ../../_images/stencilwrite-in-library.png
    3. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass 中选择 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。

      ../../_images/stencilwrite-in-library.png ../../_images/stencil-write-properties.png
  5. 渲染联系人列表:

    1. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass 中创建一个 Gather Lights Render Pass。

      您使用此渲染通道在 Viewport 2D 节点中收集使用 Stencil Render Pass 渲染通道预设的 Light 节点,这些节点点亮联系人列表。

      ../../_images/gather-lights-render-pass-in-library1.png
    2. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass > Gather Lights Render Pass 中创建一个 Draw Objects Render Pass,将其命名为 Draw ContactsList,在 Properties 中添加 Object Source 属性,并将其设置为 Content Filter Tag Filter。

      Kanzi 现在渲染 ContactsList 和 Directional Light 节点。然而,Kanzi 不渲染 Stencil 节点,因为 Content Filter 排除了带有 Stencil 标签的节点。

      ../../_images/draw-contactslist-in-library.png ../../_images/draw-contactslist-properties.png ../../_images/contactslist-in-preview-start.png
    3. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass 中创建一个 Pipeline State Render Pass,将其命名为 Stencil Test,并将 Gather Lights Render Pass 渲染通道拖到 Stencil Test 渲染通道。

      在下一步中,您使用 Stencil Test 渲染通道来将 Draw ContactsList 渲染通道的渲染限制在您在此过程的早期写入模板缓冲区的区域。

      ../../_images/stencil-test-created-in-library.png ../../_images/stencil-test-in-library.png
    4. 在 Library > Rendering > Render Pass Prefabs > Stencil Render Pass 中选择 Stencil Test,并在 Properties 中添加并设置:

      • Stencil Test Function 到 Equal

      • Stencil Function Reference Value 到 1

      通过这种方式,您将 ContactsList 节点的渲染区域限制为具有模板值 1 的像素,从而使渲染过程仅绘制与 Stencil 节点重叠的 ContactsList 节点的部分。

      ../../_images/stencil-test-in-library.png ../../_images/stencil-test-properties.png

接下来该做什么?

在本教程中,您学习了如何将模具应用到 3D 内容,使 Kanzi 仅渲染内容的选定区域。现在您可以:

另请参阅

要了解有关 Kanzi 中渲染通道的更多信息,请参阅 渲染 (Rendering)。