渲染多个渲染通道或纹理

您可以使用 Blit Render Pass 以特定材质将多个 Composition Target Render Pass 渲染通道或纹理位块传送到屏幕。默认情况下,Blit Render Pass 只位块传送一个纹理,该纹理可以是纹理资源,也可以是 Composition Target Render Pass 的结果纹理。

例如,您可以块传送多个 Composition Target Render Pass 渲染通道的结果纹理到使用特定材质的屏幕,以创建后期处理效果,如全屏泛光。请参阅 教程:创建一个 bloom 效果。

要了解如何使用 Composition Target Render Pass 渲染到多个合成目标并将结果纹理传输到屏幕,请参阅 将内容渲染到多个合成目标。

要渲染多个渲染通道或纹理:

  1. 在 Library > Materials and Textures > Material Types 中,复制 DefaultBlit 材质类型。将该材质类型重命名为 BlitMultiple,并将材质重命名为 BlitMultipleMaterial。

    小技巧

    如果您的项目不包含 DefaultBlit 材质类型,请在 Library > Materials and Textures 按 Alt 并右键单击 Material Types 中,选择 DefaultBlit。

    ../../_images/blitmultiple-and-blitmultiplematerial.png
  2. 在 BlitMultiple 材质类型中,双击 Fragment Shader 以在 Shader Source Editor 中打开它。

    ../../_images/defaultblit-fragment-shader.png
  3. 在 Shader Source Editor 中,添加您希望 Blit Render Pass 使用的 uniform,修改着色器以使用这些 uniform,然后点击 Save。

    例如,要使着色器使用自定义属性 Weight 在 Texture 0 和 Texture 1 属性之间进行混合,请将着色器文件的内容替换为

    precision mediump float;
    
    uniform sampler2D Texture0;
    uniform sampler2D Texture1;
    uniform float BlendIntensity;
    uniform float Weight;
    
    varying vec2 vTexCoord;
    
    void main()
    {
        gl_FragColor = mix(texture2D(Texture0, vTexCoord), texture2D(Texture1, vTexCoord), Weight)* BlendIntensity;
    }
    
  4. 在 Library > Materials and Textures > Material Types 中,选择 BlitMultiple 材质类型。在 Properties 中,点击 Sync with Uniforms。

    ../../_images/defaultblit-red-in-library.png ../../_images/defaultblit-sync-with-uniforms.png

    Kanzi Studio:

    1. 在 Library > Property Types 中创建您在片段着色器中定义的自定义属性类型。

      例如 Weight 属性类型。

    2. 将您在着色器中定义的属性添加到 BlitMultiple 材质类型以及使用该材质类型的材质。

      例如 Texture1 和 Weight 属性类型。

      ../../_images/blitmultiple-properties.png ../../_images/blitmultiplematerial-properties.png
  5. 在 Library > Materials and Textures > Materials 中,选择使用 BlitMultiple 材质类型的 BlitMultipleMaterial 材质。在 Properties 中,将 Blend Mode 属性设置为 Alpha: Premultiplied。

    您将 Kanzi 设置为使用此材质混合它在屏幕上绘制的纹理。

    ../../_images/defaultblitmaterial-blend-mode-alpha-premultiplied.png
  6. 在 Library 中,按 Alt 并右键单击 Rendering,并选择 Compose and Blit Pass。

    Compose and Blit Pass 包含渲染通道结构,使您能够使用特定材质将 Composition Target Render Pass 渲染通道或纹理传输到屏幕。

    Compose and Blit Pass 渲染通道预设包含以下渲染通道:

    • Composition Target Render Pass 将自身及其后代渲染通道渲染到一个或多个合成目标。

      • Clear Render Pass 清除当前渲染背景的若干或所有缓冲区。

        默认情况下,Compose and Blit Pass 中的 Clear Render Pass 使用透明黑色清除第一个颜色缓冲区,并使用值 1 清除深度缓冲区。

        例如,要使用不同的颜色清除第一个颜色缓冲区,请将 Clear Color 0 属性设置为您希望用作 Kanzi 渲染到 Composition Target Render Pass 的内容背景颜色的颜色。

      • Gather Lights Render Pass 收集您设置为使用 Compose and Blit Pass 的 Viewport 2D 节点中的 Light 节点,并将它们传递给其子 Draw Objects Render Pass 渲染通道。

        • Draw Objects Render Pass 名为 Draw Objects 允许您设置一个 Camera 节点来渲染特定的节点列表,过滤这些节点,并控制视锥体裁剪。默认情况下,Draw Objects Render Pass 使用其最近的祖先 Gather Lights Render Pass 提供的灯光来渲染节点。默认情况下,Draw Objects Render Pass 使用默认的 Camera 节点来渲染 Viewport 2D 节点中的所有节点。

    • Blit Render Pass 使用一种特定材质将一个或多个单一纹理或立方体贴图纹理位块传送到屏幕。

      默认情况下,该 Blit Render Pass 在屏幕上绘制 Composition Target Render Pass 渲染其内容的第一个颜色纹理。

      ../../_images/compose-and-blit-pass-create1.png ../../_images/compose-and-blit-pass-library1.png
  7. 在 Node Tree 中,选择您要将其内容渲染到合成目标的 Viewport 2D 节点。在 Properties 中,将 Render Pass Prefab 属性设置为 Compose and Blit Pass。

    Kanzi 将该 Viewport 2D 中的场景渲染到合成目标,并使用 Blit Render Pass 将内容绘制到屏幕上。

    ../../_images/viewport-2d-in-the-project.png ../../_images/render-pass-prefab-set-to-compose-and-blit-pass.png
  8. 在 Library > Rendering > Render Pass Prefabs 中,选择 Compose and Blit Pass > Blit Render Pass。在 Properties 中添加并设置:

    • 将 Blit Render Pass > Texture 1 设置为纹理,或将其绑定到您要使用的 Composition Target Render Pass 的结果纹理

      例如,添加 Texture 1 属性并将其设置为纹理资源。

    • 将 Material 应用于您希望 Blit Render Pass 使用的材质。

      例如,将其设置为 BlitMultipleMaterial 材质,该材质的片段着色器您在此过程的早期进行了编辑,以使材质支持混合两种纹理。

    • 将 Material Properties > Weight 设置为您希望每个纹理显示的程度

      要增加 Texture 0 的权重,请减小 Weight 属性的值;要增加 Texture 1 的权重,请增大该值。例如,要显示 Texture 0 和 Texture 1 属性所设置纹理的平均值,请将 Weight 设置为 0.5。

    ../../_images/blit-render-pass-properties-texture1-and-material-set.png ../../_images/scene-defaultrenderpass.png ../../_images/scene-group-render-pass.png

另请参阅

教程:创建一个 bloom 效果

将内容渲染到合成目标

创建后期处理效果

渲染 (Rendering)

使用材料类型

着色器 (Shaders)

纹理 (Textures)