- Home /
5.3 : Display particles over an Image component
Hello,
My problem is very simple : How to make particles pop over an Image (UI) when they pop behind.
I have already read about : making 2 canevas, using sorting layers, making a canevas in a canevas with override sorting... Like this one and this old one. Nothing works for me.
Does someone have a very simple but complete example of hierarchy and tweakings that perform this ? In other words:
If I create a new Unity 3D project with nothing in it, then what are the steps to create a particule system that pop over an UI.Image inside a canevas ?
I am not a beginner with Unity and layers, but I really don't get what I am missing here. Maybe an example from scratch would help me to understand the problem with my project. Thank you for your help.
Answer by Anton-Korhonen · Oct 06, 2016 at 10:37 AM
You have to use another camera object with orthographic projection to render a particle system on top of a UI element.
Basically:
Put the particle system outside ofyour play area within a layer of your choosing (e.g. UI)
Set a new camera object with orthographic projection pointing at the particle system
Set the camera clear flags to the layer you chose (e.g. UI)
Set the depth of the camera higher than your main camera
At the moment i can't provide you with an example, but maybe later today.
Thank you for your answer. I followed your points one by one, and I meet one of the situation I have already test. I have a 3D plane and the UI Image display by the main cam and the particles display by the Particles cam.
The depth of the "PCam" is inferior to the depth of the "$$anonymous$$ainCam":
The depth of the "PCam" is superior to the depth of the "$$anonymous$$ainCam":
So in the second case, the plane is just "override by the nothing" of the PCam, but Unity still consider that all in UI Layer is display on the foreground.
You could try rendering the particle camera to a texture and then drawing the texture on screen with overlay.
Create a Render Texture (Right click in project folder view -> Create -> Render Texture)
Assign the Target Texture field of the particle camera as the render texture you just created
Create a Canvas and set the Render mode to Screen Space - Overlay
Create a child gameobject to the canvas and add a Raw Image component to it and assign the render texture you created to the Texture field
I made a quick try this morning, but I couldn't get a result, looks like my RenderTexture stay completly transparent. I have never used RenderTexture before so maybe I need to read some doc to make it work. If I can make it work, I'll let you know if this way does the trick with my particle plroblem.
But I was also wondering if you have some info about performances with this solution, because I am working on a mobile game (if it's too expensive I think I'll just try something with an Animation component on a limited number of "fake particles" gameObjects. This is my plan B)
Your answer
Follow this Question
Related Questions
UI object drawing order is different between Unity Editor and Standalone version 1 Answer
Place UI text on top of other elements in 2D 1 Answer
Rendering particles in front of a canvas when using Screen Space - Overlay in 2019.4.10f1 0 Answers
2D renderer with particles on UI 1 Answer
How to achieve specific blurred spark-like particle effect in UI 0 Answers