Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Render to Texture #186

Merged
merged 39 commits into from
Apr 23, 2024
Merged

Render to Texture #186

merged 39 commits into from
Apr 23, 2024

Conversation

erikhaandrikman
Copy link
Contributor

@erikhaandrikman erikhaandrikman commented Feb 28, 2024

This feature introduces the capability to render the scene onto a texture, facilitating post-processing effects and potentially allowing for the caching of static UI elements.

Tasks

  • Nested render textures follow a bottom-up render order
  • Automatic clipping support
  • Rendering framebuffer smaller than the viewport maintains correct aspect ratio

Done

  • Rendering the node and its children onto a texture
  • Updating the render texture to reflect changes in child nodes
  • Prevent buffering of render texture child vertices

@wouterlucas
Copy link
Contributor

lets go

@frank-weindel
Copy link
Collaborator

Super cool!!! Love the reflection demo.

@wouterlucas wouterlucas linked an issue Mar 18, 2024 that may be closed by this pull request
@wouterlucas wouterlucas added this to the Release Candidate 1 milestone Mar 18, 2024
@wouterlucas wouterlucas added the do not merge Do not merge this PR. It may not be ready or depends on another PR to be merged first. label Mar 18, 2024
@erikhaandrikman
Copy link
Contributor Author

thanks for reviewing, i'm currently addressing the comment you provided

@erikhaandrikman erikhaandrikman removed the do not merge Do not merge this PR. It may not be ready or depends on another PR to be merged first. label Apr 9, 2024
if (this.parentHasRenderTexture && !this.rtt) {
return this.parent?.framebufferDimensions;
}
return { width: this.width, height: this.height };
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If a user updates the width/height properties of an RTT Node this may cause the frame buffer dimensions to be reported differently than the size of the texture that is initially allocated.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dimension updates will now also reflect to the render texture

src/core/CoreNode.ts Outdated Show resolved Hide resolved
}

get parentHasRenderTexture(): boolean {
return this.props.parentHasRenderTexture;
Copy link
Collaborator

@frank-weindel frank-weindel Apr 11, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As mentioned in another comment, this property could just live in the CoreNode and simply reach up the parent tree to find out if a parent has RTT on. If that reaching up is too inefficient it could be calculated during an update() stage.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Moved the logic for tracking whether the parent has a render texture to the CoreNode. This is now being calculated during node update()

this.hasRTTupdates = true;

// Store RTT nodes in a separate list
this.stage.renderer?.renderToTexture(this);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If rtt is set to false does it remain in this structure?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good question! It prompted me to revisit this. I've added support to dynamically toggle render to texture on a Node. This opens up the door for rendering an entire app to a texture, allowing for the application of post-processing effects, before disabling render to texture.

src/core/CoreNode.ts Outdated Show resolved Hide resolved
@frank-weindel
Copy link
Collaborator

LGTM! Awesome work.

@erikhaandrikman erikhaandrikman added this pull request to the merge queue Apr 23, 2024
Merged via the queue into main with commit a11c9d0 Apr 23, 2024
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
No open projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Render to Texture
3 participants