Apply Bloom only to specific Materials

Hey,

Thanks for the quick reply. i talking about a bloom shader that takes an material and blooms that.

1 Like

Hi @Sinlyu,

Check this post:

2 Likes

Already did. I also created an “Bloom” Layer set the RenderTarget and rendered the layer to an texture. but after that im not sure what to do.

1 Like

Summoning @mvaligursky. :smile:

1 Like

Make sure you have a camera that renders that layer. Without a code snippet it will be hard to tell what is wrong. You can also check this example and see if there are steps you missing:
https://playcanvas.github.io/#graphics/post-effects.html

I would probably do this:

  1. change the current camera that render the world to be at priority 1 (so it renders second)
  2. add a child camera to current camera, with the same perspective settings. Making it a child should make it have the same transformation. Call it BloomCamera, set its priority to 0 ( so it renders first), add a layer to it with objects you want bloomed. And set it up to render to a render target texture. And clear color to black on this camera.
  3. Attach bloom postprocessing to this BloomCamera - this should bloom only the object that you rendered to it.
  4. To your main camera set up some callback, for example on before UI layer gets rendered. This should additively blend the bloomed renderer target texture on top of already rendered framebuffer of the main camera.

reference: this is probably the closest to what you need. http://playcanvas.github.io/#graphics/render-to-texture.html
It renders to texture and then uses that texture inside the scene … but not full screen.

3 Likes

Thank you, @mvaligursky, for step-by-step instructions. What do you mean by setting a callback to camera on before UI gets rendered?

Thank you for your help. i could not find anything on how to blend the texture into the framebuffer. Do you have some example for that. for the callback i thought about using “uiLayer.onPreRender”.

Perhaps this callback on UI layer could be used.
https://developer.playcanvas.com/en/api/pc.Layer.html#onPreRender

Blend texture to framebuffer … this basically means to render full screen quad using the bloomed textured. As an example you can study post processing effects, such as bloom … they internally render multiple full screen passes for blurring the texture. So you’d need something similar.

And also I’ve relalized … if you only render few objects into the bloom texture and bloom that, it would not interact with the scene in cases something is rendered over the top. Example: you have a character you bloom, but in the scene its only half visible from behind a wall. This solution would bloom and make visible even hidden part of the character. To work around it, you’d need to do a depth pre-pass to your bloom texture - basically render the whole scene bit disable color rendering, and only write to the depth map. That would cause the character to be properly occluded.

Completely different way to approach it would be to use alpha channel of your render target to mask what needs to be bloomed. This way you would render the scene only one time, and during the opaque rendering, change the alpha output to mark meshes you want bloomed - for example character would output 1, everything else would output 0. Then at the end of opaque layers, you’d use this texture to apply bloom based on this alpha channel.

None of these are very easy to set up to be honest.

4 Likes

I did manage to render the Bloom Layer to a Texture. for a test i render the result to a plane. The issue is after i enable bloom on the camera the rendering is empty.

here is a test scene:
https://playcanvas.com/editor/project/770478

Fixed the render issue, but on my rendered texture no bloom was applied.

have a l look at here Post Process doesn't work at logRenderActions and try it as well to get a log of what is happening. Perhaps post it here as well.

1 Like

Here is the result:

0 Cam: BloomCamera      Lay: Bloom            TRANSP ENABLED  Meshes:  0 RT: Untitled                  Clear: Color Depth Stencil CAM-FIRST
1 Cam: BloomCamera      Lay: Bloom            OPAQUE ENABLED  Meshes:  2 RT: Untitled                  Clear: ..... ..... ....... POSTPROCESS
2 Cam: Camera           Lay: World            OPAQUE ENABLED  Meshes:  2 RT: -                         Clear: Color Depth Stencil CAM-FIRST
3 Cam: Camera           Lay: Depth            OPAQUE DISABLED Meshes:  0 RT: -                         Clear: ..... ..... .......
4 Cam: Camera           Lay: Skybox           OPAQUE ENABLED  Meshes:  0 RT: -                         Clear: ..... ..... .......
5 Cam: Camera           Lay: World            TRANSP ENABLED  Meshes:  0 RT: -                         Clear: ..... ..... .......
6 Cam: Camera           Lay: Immediate        OPAQUE ENABLED  Meshes:  0 RT: -                         Clear: ..... ..... .......
7 Cam: Camera           Lay: Immediate        TRANSP ENABLED  Meshes:  0 RT: -                         Clear: ..... ..... ....... POSTPROCESS

can you show the whole thing? it’s cropped on the right side … and that’s where the render target and clearing stuff is displayed

1 Like

here is an screenshot of it. but i dont think that i missed anything

There is a scrollbar :wink:

1 Like

Ah … I thought it was part of the screenshot! :slight_smile:

3 Likes

I’ll need to test it locally … hopefully in a few days.

1 Like

I’ve create an issue to get this fixed https://github.com/playcanvas/engine/issues/2941

Thanks a lot. looking forward to the fix. I also really appreciate all the support from the devs and the community.

3 Likes