Support post process #2129
Support post process #2129
Conversation
# Conflicts: # packages/core/src/RenderPipeline/BasicRenderPipeline.ts # packages/core/src/RenderPipeline/RenderContext.ts
zhuxudong
added
Rendering
WalkthroughThis update introduces significant enhancements to the post-processing capabilities in the rendering engine. The Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant Scene
participant Camera
participant PostProcessManager
participant BloomEffect
User->>Scene: Initialize scene
Scene->>PostProcessManager: Initialize post-process manager
PostProcessManager->>BloomEffect: Add bloom effect
PostProcessManager->>Camera: Attach to camera
Camera-->>Scene: Render scene
Scene->>PostProcessManager: Apply post-processing
PostProcessManager->>BloomEffect: Render bloom effect
BloomEffect->>Camera: Output final image
Camera-->>User: Display processed image
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (3)
- packages/core/src/Camera.ts (10 hunks)
- packages/core/src/postProcess/PostProcessManager.ts (1 hunks)
- packages/core/src/postProcess/shaders/Tonemapping/ACES/RRT.glsl (1 hunks)
Files skipped from review as they are similar to previous changes (3)
- packages/core/src/Camera.ts
- packages/core/src/postProcess/PostProcessManager.ts
- packages/core/src/postProcess/shaders/Tonemapping/ACES/RRT.glsl
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (1)
- packages/core/src/postProcess/effects/BloomEffect.ts (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- packages/core/src/postProcess/effects/BloomEffect.ts
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- packages/core/src/RenderPipeline/BasicRenderPipeline.ts (5 hunks)
- packages/core/src/postProcess/PostProcessManager.ts (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- packages/core/src/postProcess/PostProcessManager.ts
Additional comments not posted (5)
packages/core/src/RenderPipeline/BasicRenderPipeline.ts (5)
15-22: Imports look good.The added import statements are necessary for the new functionality related to texture handling and post-processing effects.
Line range hint
34-34: Initialization of_internalColorTargetlooks good.Initializing
_internalColorTargettonullis standard practice.
198-222: Post-process rendering section looks good.The modifications ensure that post-process effects are applied correctly when enabled.
However, verify the function's behavior with various post-process effects to ensure correctness.
Verification successful
Post-process rendering section looks good.
The modifications ensure that post-process effects are applied correctly when enabled. The end-to-end tests confirm the functionality with specific post-process effects like bloom and tonemapping.
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify behavior of post-process rendering section with various post-process effects. # Test: Search for the post-process rendering section usage. Expect: Correct application of post-process effects. rg --type typescript -A 5 $'postProcessManager._render'Length of output: 89
Script:
#!/bin/bash # Description: Verify behavior of post-process rendering section with various post-process effects. # Test: Search for the post-process rendering section usage. Expect: Correct application of post-process effects. rg --type ts -A 5 $'postProcessManager._render'Length of output: 599
Script:
#!/bin/bash # Description: Verify behavior of post-process rendering section with various post-process effects. # Test: Search for other usages of `postProcessManager` in the codebase. rg --type ts 'postProcessManager'Length of output: 904
Script:
#!/bin/bash # Extract relevant test cases from the end-to-end test file for post-process effects. rg --type ts -A 10 'postProcessManager' e2e/case/postProcess-bloom-tonemap.tsLength of output: 462
Line range hint
153-222: Changes to_drawRenderPassmethod look good.The modifications introduce post-process rendering and blitting operations, enhancing the rendering pipeline's flexibility.
However, verify the function's behavior with various post-process effects to ensure correctness.
118-124: Changes to the render method look good.The modifications ensure the internal color texture is created and configured correctly based on the camera properties.
However, verify the function's behavior with various camera configurations to ensure correctness.
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (3)
- packages/core/src/Camera.ts (10 hunks)
- packages/core/src/RenderPipeline/BasicRenderPipeline.ts (5 hunks)
- packages/core/src/postProcess/PostProcessManager.ts (1 hunks)
Files skipped from review as they are similar to previous changes (3)
- packages/core/src/Camera.ts
- packages/core/src/RenderPipeline/BasicRenderPipeline.ts
- packages/core/src/postProcess/PostProcessManager.ts
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- packages/core/src/postProcess/PostProcessManager.ts (1 hunks)
- packages/core/src/postProcess/effects/BloomEffect.ts (1 hunks)
Files skipped from review as they are similar to previous changes (2)
- packages/core/src/postProcess/PostProcessManager.ts
- packages/core/src/postProcess/effects/BloomEffect.ts
There was a problem hiding this comment.
Actionable comments posted: 2
Outside diff range, codebase verification and nitpick comments (2)
e2e/case/postProcess-HDR-bloom-neutral.ts (1)
1-4: Add a description for the test case.Consider adding a brief description of the test case's purpose for better understanding.
/** + * This test case sets up a post-processing environment with HDR, Bloom effect, and Neutral Tonemapping. * @title Bloom + HDR + Neutral Tonemapping * @category PostProcess */e2e/case/postProcess-LDR-bloom-neutral.ts (1)
1-4: Add a description for the test case.Consider adding a brief description of the test case's purpose for better understanding.
/** + * This test case sets up a post-processing environment with LDR, Bloom effect, and Neutral Tonemapping. * @title Bloom + LDR + Neutral Tonemapping * @category PostProcess */
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (3)
e2e/fixtures/originImage/PostProcess_postProcess-HDR-bloom-ACES.jpgis excluded by!**/*.jpge2e/fixtures/originImage/PostProcess_postProcess-HDR-bloom-neutral.jpgis excluded by!**/*.jpge2e/fixtures/originImage/PostProcess_postProcess-LDR-bloom-neutral.jpgis excluded by!**/*.jpg
Files selected for processing (7)
- e2e/case/.initPostProcessEnv.ts (1 hunks)
- e2e/case/postProcess-HDR-bloom-ACES.ts (1 hunks)
- e2e/case/postProcess-HDR-bloom-neutral.ts (1 hunks)
- e2e/case/postProcess-LDR-bloom-neutral.ts (1 hunks)
- e2e/config.ts (1 hunks)
- packages/core/src/Camera.ts (10 hunks)
- packages/core/src/RenderPipeline/BasicRenderPipeline.ts (5 hunks)
Files skipped from review due to trivial changes (1)
- e2e/case/postProcess-HDR-bloom-ACES.ts
Files skipped from review as they are similar to previous changes (3)
- e2e/config.ts
- packages/core/src/Camera.ts
- packages/core/src/RenderPipeline/BasicRenderPipeline.ts
Additional comments not posted (18)
e2e/case/postProcess-HDR-bloom-neutral.ts (4)
5-6: Ensure theinitPostProcessEnvfunction handles errors.The
initPostProcessEnvfunction should handle potential errors during initialization.import { Camera, TonemappingMode } from "@galacean/engine"; import { initPostProcessEnv } from "./.initPostProcessEnv";
8-10: Consider adding error handling for the callback function.Ensure that the callback function handles any errors that may occur during execution.
initPostProcessEnv((camera: Camera, resArray) => { const [_, __, dirtTexture] = resArray; const scene = camera.scene; // Add error handling logic here if necessary
12-13: Enable post-processing and HDR correctly.Ensure that enabling post-processing and HDR is done correctly. No changes needed.
camera.enablePostProcess = true; camera.enableHDR = true;
19-24: Configure Bloom and Tonemapping effects correctly.Ensure that the Bloom and Tonemapping effects are configured correctly. No changes needed.
bloomEffect.enabled = true; tonemappingEffect.enabled = true; bloomEffect.threshold = 0.5; bloomEffect.dirtTexture = dirtTexture; tonemappingEffect.mode = TonemappingMode.Neutral;e2e/case/postProcess-LDR-bloom-neutral.ts (4)
5-6: Ensure theinitPostProcessEnvfunction handles errors.The
initPostProcessEnvfunction should handle potential errors during initialization.import { Camera, TonemappingMode } from "@galacean/engine"; import { initPostProcessEnv } from "./.initPostProcessEnv";
8-10: Consider adding error handling for the callback function.Ensure that the callback function handles any errors that may occur during execution.
initPostProcessEnv((camera: Camera, resArray) => { const [_, __, dirtTexture] = resArray; const scene = camera.scene; // Add error handling logic here if necessary
12-13: Enable post-processing and LDR correctly.Ensure that enabling post-processing and LDR is done correctly. No changes needed.
camera.enablePostProcess = true; camera.enableHDR = false;
19-24: Configure Bloom and Tonemapping effects correctly.Ensure that the Bloom and Tonemapping effects are configured correctly. No changes needed.
bloomEffect.enabled = true; tonemappingEffect.enabled = true; bloomEffect.threshold = 0.5; bloomEffect.dirtTexture = dirtTexture; tonemappingEffect.mode = TonemappingMode.Neutral;e2e/case/.initPostProcessEnv.ts (10)
1-12: Ensure all imports are necessary.Verify that all imported modules are necessary for the function.
import { AmbientLight, AssetType, BackgroundMode, Camera, GLTFResource, PrimitiveMesh, SkyBoxMaterial, Texture2D, Vector3, WebGLEngine } from "@galacean/engine"; import { initScreenshot, updateForE2E } from "./.mockForE2E";
15-17: Add error handling for the callback function.Ensure that the callback function handles any errors that may occur during execution.
export async function initPostProcessEnv( callback: (camera: Camera, resArray: [GLTFResource, AmbientLight, Texture2D]) => void ) {
18-19: Handle potential errors fromWebGLEngine.create.Ensure that potential errors from
WebGLEngine.createare handled properly.WebGLEngine.create({ canvas: "canvas" }).then((engine) => { engine.canvas.resizeByClientSize();
21-22: Check for errors during scene creation.Ensure that errors during scene creation are handled.
const scene = engine.sceneManager.activeScene; const rootEntity = scene.createRootEntity();
24-28: Ensure camera setup is correct.Verify the correctness of the camera setup.
//Create camera const cameraNode = rootEntity.createChild("camera_node"); cameraNode.transform.position.set(4, 0, 6); cameraNode.transform.lookAt(new Vector3(1, 0, 0)); const camera = cameraNode.addComponent(Camera);
30-37: Handle potential errors during asset loading.Ensure that potential errors during asset loading are handled.
Promise.all([ engine.resourceManager .load<GLTFResource>("https://gw.alipayobjects.com/os/bmw-prod/a1da72a4-023e-4bb1-9629-0f4b0f6b6fc4.glb") .then((glTF) => { const defaultSceneRoot = glTF.instantiateSceneRoot(); rootEntity.addChild(defaultSceneRoot); return glTF; }),
38-54: Ensure ambient light and skybox setup is correct.Verify the correctness of the ambient light and skybox setup.
engine.resourceManager .load<AmbientLight>({ type: AssetType.Env, url: "https://gw.alipayobjects.com/os/bmw-prod/89c54544-1184-45a1-b0f5-c0b17e5c3e68.bin" }) .then((ambientLight) => { scene.ambientLight = ambientLight; const sky = scene.background.sky; const skyMaterial = new SkyBoxMaterial(engine); scene.background.mode = BackgroundMode.Sky; sky.material = skyMaterial; sky.mesh = PrimitiveMesh.createCuboid(engine, 1, 1, 1); skyMaterial.texture = ambientLight.specularTexture; skyMaterial.textureDecodeRGBM = true; return ambientLight; }),
55-58: Handle potential errors during texture loading.Ensure that potential errors during texture loading are handled.
engine.resourceManager.load<Texture2D>({ type: AssetType.Texture2D, url: "https://mdn.alipayobjects.com/huamei_dmxymu/afts/img/A*tMeTQ4Mx60oAAAAAAAAAAAAADuuHAQ/original" })
59-65: Ensure callback and E2E update are correct.Verify the correctness of the callback invocation and E2E update.
]).then((resArray) => { callback(camera, resArray); updateForE2E(engine); initScreenshot(engine, camera); });
66-67: Handle potential errors fromPromise.all.Ensure that potential errors from
Promise.allare handled properly.}); }
| // @ts-ignore | ||
| const bloomEffect = scene._postProcessManager._bloomEffect; | ||
| // @ts-ignore | ||
| const tonemappingEffect = scene._postProcessManager._tonemappingEffect; |
There was a problem hiding this comment.
Avoid using private properties directly.
Using private properties like _postProcessManager directly is discouraged. Consider adding public methods to access these properties.
// @ts-ignore
const bloomEffect = scene._postProcessManager._bloomEffect;
// @ts-ignore
const tonemappingEffect = scene._postProcessManager._tonemappingEffect;
// Consider refactoring to use public methods if availableCommittable suggestion was skipped due to low confidence.
| // @ts-ignore | ||
| const bloomEffect = scene._postProcessManager._bloomEffect; | ||
| // @ts-ignore | ||
| const tonemappingEffect = scene._postProcessManager._tonemappingEffect; |
There was a problem hiding this comment.
Avoid using private properties directly.
Using private properties like _postProcessManager directly is discouraged. Consider adding public methods to access these properties.
// @ts-ignore
const bloomEffect = scene._postProcessManager._bloomEffect;
// @ts-ignore
const tonemappingEffect = scene._postProcessManager._tonemappingEffect;
// Consider refactoring to use public methods if availableCommittable suggestion was skipped due to low confidence.
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (1)
- packages/core/src/shaderlib/pbr/pbr_helper.glsl (3 hunks)
Files skipped from review as they are similar to previous changes (1)
- packages/core/src/shaderlib/pbr/pbr_helper.glsl
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (5)
- packages/core/src/RenderPipeline/PipelineUtils.ts (9 hunks)
- packages/core/src/Scene.ts (2 hunks)
- packages/core/src/postProcess/PostProcessManager.ts (1 hunks)
- packages/core/src/postProcess/effects/BloomEffect.ts (1 hunks)
- packages/core/src/postProcess/index.ts (1 hunks)
Files skipped from review as they are similar to previous changes (5)
- packages/core/src/RenderPipeline/PipelineUtils.ts
- packages/core/src/Scene.ts
- packages/core/src/postProcess/PostProcessManager.ts
- packages/core/src/postProcess/effects/BloomEffect.ts
- packages/core/src/postProcess/index.ts
RFC: https://yuque.antfin-inc.com/shensi.zxd/ftoum6/gheugo4e7e1c1oil
Please check if the PR fulfills these requirements
Summary by CodeRabbit
New Features
PostProcessManagerclass.Enhancements
Bug Fixes
Configuration