Merge pull request #13036 from carolhmj/renderUIAfterPostProcesses

Add applyPostProcess flag on ADV to optionally draw it after the post… Former-commit-id: 65b48dad5fdd605ecf428c00938c1df2939a9309
BabylonJS · Sep 28, 2022 · fec9648 · fec9648
2 parents b93e63d + 6d06f14
commit fec9648
Show file tree

Hide file tree

Showing 7 changed files with 74 additions and 11 deletions.
diff --git a/packages/dev/core/src/Layers/layer.ts b/packages/dev/core/src/Layers/layer.ts
@@ -35,6 +35,18 @@ export class Layer {
      */
     public isBackground: boolean;
 
+    private _applyPostProcess: boolean = true;
+    /**
+     * Determines if the layer is drawn before (true) or after (false) post-processing.
+     * If the layer is background, it is always before.
+     */
+    public set applyPostProcess(value: boolean) {
+        this._applyPostProcess = value;
+    }
+    public get applyPostProcess(): boolean {
+        return this.isBackground || this._applyPostProcess;
+    }
+
     /**
      * Define the color of the layer (instead of texture).
      */

diff --git a/packages/dev/core/src/Layers/layerSceneComponent.ts b/packages/dev/core/src/Layers/layerSceneComponent.ts
@@ -52,10 +52,16 @@ export class LayerSceneComponent implements ISceneComponent {
      */
     public register(): void {
         this.scene._beforeCameraDrawStage.registerStep(SceneComponentConstants.STEP_BEFORECAMERADRAW_LAYER, this, this._drawCameraBackground);
-        this.scene._afterCameraDrawStage.registerStep(SceneComponentConstants.STEP_AFTERCAMERADRAW_LAYER, this, this._drawCameraForeground);
+        this.scene._afterCameraDrawStage.registerStep(SceneComponentConstants.STEP_AFTERCAMERADRAW_LAYER, this, this._drawCameraForegroundWithPostProcessing);
+        this.scene._afterCameraPostProcessStage.registerStep(SceneComponentConstants.STEP_AFTERCAMERAPOSTPROCESS_LAYER, this, this._drawCameraForegroundWithoutPostProcessing);
 
         this.scene._beforeRenderTargetDrawStage.registerStep(SceneComponentConstants.STEP_BEFORERENDERTARGETDRAW_LAYER, this, this._drawRenderTargetBackground);
-        this.scene._afterRenderTargetDrawStage.registerStep(SceneComponentConstants.STEP_AFTERRENDERTARGETDRAW_LAYER, this, this._drawRenderTargetForeground);
+        this.scene._afterRenderTargetDrawStage.registerStep(SceneComponentConstants.STEP_AFTERRENDERTARGETDRAW_LAYER, this, this._drawRenderTargetForegroundWithPostProcessing);
+        this.scene._afterRenderTargetPostProcessStage.registerStep(
+            SceneComponentConstants.STEP_AFTERRENDERTARGETPOSTPROCESS_LAYER,
+            this,
+            this._drawRenderTargetForegroundWithoutPostProcessing
+        );
     }
 
     /**
@@ -95,40 +101,58 @@ export class LayerSceneComponent implements ISceneComponent {
         }
     }
 
-    private _drawCameraPredicate(layer: Layer, isBackground: boolean, cameraLayerMask: number): boolean {
-        return !layer.renderOnlyInRenderTargetTextures && layer.isBackground === isBackground && (layer.layerMask & cameraLayerMask) !== 0;
+    private _drawCameraPredicate(layer: Layer, isBackground: boolean, applyPostProcess: boolean, cameraLayerMask: number): boolean {
+        return (
+            !layer.renderOnlyInRenderTargetTextures &&
+            layer.isBackground === isBackground &&
+            layer.applyPostProcess === applyPostProcess &&
+            (layer.layerMask & cameraLayerMask) !== 0
+        );
     }
 
     private _drawCameraBackground(camera: Camera): void {
         this._draw((layer: Layer) => {
-            return this._drawCameraPredicate(layer, true, camera.layerMask);
+            return this._drawCameraPredicate(layer, true, true, camera.layerMask);
         });
     }
 
-    private _drawCameraForeground(camera: Camera): void {
+    private _drawCameraForegroundWithPostProcessing(camera: Camera): void {
         this._draw((layer: Layer) => {
-            return this._drawCameraPredicate(layer, false, camera.layerMask);
+            return this._drawCameraPredicate(layer, false, true, camera.layerMask);
         });
     }
 
-    private _drawRenderTargetPredicate(layer: Layer, isBackground: boolean, cameraLayerMask: number, renderTargetTexture: RenderTargetTexture): boolean {
+    private _drawCameraForegroundWithoutPostProcessing(camera: Camera): void {
+        this._draw((layer: Layer) => {
+            return this._drawCameraPredicate(layer, false, false, camera.layerMask);
+        });
+    }
+
+    private _drawRenderTargetPredicate(layer: Layer, isBackground: boolean, applyPostProcess: boolean, cameraLayerMask: number, renderTargetTexture: RenderTargetTexture): boolean {
         return (
             layer.renderTargetTextures.length > 0 &&
             layer.isBackground === isBackground &&
+            layer.applyPostProcess === applyPostProcess &&
             layer.renderTargetTextures.indexOf(renderTargetTexture) > -1 &&
             (layer.layerMask & cameraLayerMask) !== 0
         );
     }
 
     private _drawRenderTargetBackground(renderTarget: RenderTargetTexture): void {
         this._draw((layer: Layer) => {
-            return this._drawRenderTargetPredicate(layer, true, this.scene.activeCamera!.layerMask, renderTarget);
+            return this._drawRenderTargetPredicate(layer, true, true, this.scene.activeCamera!.layerMask, renderTarget);
+        });
+    }
+
+    private _drawRenderTargetForegroundWithPostProcessing(renderTarget: RenderTargetTexture): void {
+        this._draw((layer: Layer) => {
+            return this._drawRenderTargetPredicate(layer, false, true, this.scene.activeCamera!.layerMask, renderTarget);
         });
     }
 
-    private _drawRenderTargetForeground(renderTarget: RenderTargetTexture): void {
+    private _drawRenderTargetForegroundWithoutPostProcessing(renderTarget: RenderTargetTexture): void {
         this._draw((layer: Layer) => {
-            return this._drawRenderTargetPredicate(layer, false, this.scene.activeCamera!.layerMask, renderTarget);
+            return this._drawRenderTargetPredicate(layer, false, false, this.scene.activeCamera!.layerMask, renderTarget);
         });
     }
 

diff --git a/packages/dev/core/src/Materials/Textures/renderTargetTexture.ts b/packages/dev/core/src/Materials/Textures/renderTargetTexture.ts
@@ -1131,6 +1131,10 @@ export class RenderTargetTexture extends Texture implements IRenderTargetTexture
                 scene.postProcessManager._finalizeFrame(false, this._renderTarget ?? undefined, faceIndex);
             }
 
+            for (const step of scene._afterRenderTargetPostProcessStage) {
+                step.action(this, faceIndex, layer);
+            }
+
             if (this._texture) {
                 this._texture.generateMipMaps = saveGenerateMipMaps;
             }

diff --git a/packages/dev/core/src/scene.ts b/packages/dev/core/src/scene.ts
@@ -1524,11 +1524,20 @@ export class Scene extends AbstractScene implements IAnimatable, IClipPlanesHold
      * Defines the actions happening just after the active camera has been drawn.
      */
     public _afterCameraDrawStage = Stage.Create<CameraStageAction>();
+    /**
+     * @internal
+     * Defines the actions happening just after the post processing
+     */
+    public _afterCameraPostProcessStage = Stage.Create<CameraStageAction>();
     /**
      * @internal
      * Defines the actions happening just after a render target has been drawn.
      */
     public _afterRenderTargetDrawStage = Stage.Create<RenderTargetStageAction>();
+    /**
+     * Defines the actions happening just after the post processing on a render target
+     */
+    public _afterRenderTargetPostProcessStage = Stage.Create<RenderTargetStageAction>();
     /**
      * @internal
      * Defines the actions happening just after rendering all cameras and computing intersections.
@@ -4224,6 +4233,11 @@ export class Scene extends AbstractScene implements IAnimatable, IClipPlanesHold
             this.postProcessManager._finalizeFrame(camera.isIntermediate, texture);
         }
 
+        // After post process
+        for (const step of this._afterCameraPostProcessStage) {
+            step.action(this.activeCamera);
+        }
+
         // Reset some special arrays
         this._renderTargets.reset();
 

diff --git a/packages/dev/core/src/sceneComponent.ts b/packages/dev/core/src/sceneComponent.ts
@@ -81,6 +81,10 @@ export class SceneComponentConstants {
     public static readonly STEP_AFTERCAMERADRAW_EFFECTLAYER_DRAW = 3;
     public static readonly STEP_AFTERCAMERADRAW_LAYER = 4;
 
+    public static readonly STEP_AFTERCAMERAPOSTPROCESS_LAYER = 0;
+
+    public static readonly STEP_AFTERRENDERTARGETPOSTPROCESS_LAYER = 0;
+
     public static readonly STEP_AFTERRENDER_AUDIO = 0;
 
     public static readonly STEP_GATHERRENDERTARGETS_DEPTHRENDERER = 0;

diff --git a/packages/tools/tests/test/visualization/ReferenceImages/uiUnaffected.png b/packages/tools/tests/test/visualization/ReferenceImages/uiUnaffected.png
diff --git a/packages/tools/tests/test/visualization/config.json b/packages/tools/tests/test/visualization/config.json
@@ -1460,6 +1460,11 @@
             "title": "Serialize scene without materials",
             "playgroundId": "#PH4DEZ#1",
             "referenceImage": "serializeWithoutMaterials.png"
+        },
+        {
+            "title": "UI unaffected by post-process",
+            "playgroundId": "#XJVHWQ",
+            "referenceImage": "uiUnaffected.png"
         }
     ]
 }