How should I do a UI particle system?

[bockpe]

Hi!
I’m trying to do some particle effects in my UI. And I’ve found a couple of ways to do it but none that doesn’t ruin the rest of my UI.

I am using Unity 2019.4.10 and the default URP.

For reference, I tried following this tutorial:

but I don’t have the clear flags option on my cameras my options were just very different in general. I’m guessing that has to to with Unity version.
So I couldn’t accomplish it quite like that. But I tried adding a UI camera with Base Render Type, these settings basically:

Then I set the canvas render mode to Screen space - Camera and selected the UI camera.
Now this basically worked, as long as I had a full screen UI. But for most of the game, when you’re actually playing it, there’s just a UI overlay with things happening in the actual world space, you know. But the UI camera get some sort of precedence here it seems, and since it’s just rendering UI objects, you can’t see anything from the actual game.

And I can’t just deactivate that camera whenever the UI is not in full screen, because I still want the hud/overlay to be visible.

So I would like to have some sort of combination of the cameras simultaneously. This is when I came across camera stacking, and also when I came across this other tutorial, where the guy managed to do this with an overlay camera:

Unity 2022 show particle system in UI

He was using this camera stacking feature, and as you can see in my print screen, this option wasn’t available to me. I tried upgrading Post-processing to version 3.0.3 through the package manager but this made no difference.

I thought about adding one canvas for overlays and one canvas for full screen UI, that way I probably could get it to work. But my UI is built on one canvas and adding more would mean quite a bit of refactoring and I feel like the whole setup in this case just makes less sense when adding more canvases.

I would also like to stay on the same Unity version if possible.

So my questions would be, why isn’t camera stacking working? Does anybody know how to get that to work? Is there another way to get some particle effects in my UI while sticking to the same Unity version and just one Canvas? Do I have to switch Unity version? Do I have to add another Canvas? Any type of guidance would be appreciated!

Thanks.

[Difre]

A UI particle system can add a nice visual touch to your user interface, and there are several ways you can achieve this effect. Here are some steps to help you create a UI particle system:

Choose a particle system library: There are several particle system libraries available that you can use to create your UI particle system, such as Particle.js or Pixi.js. Choose a library thesambad fits your needs and programming language.

Define your particles: You can define the size, shape, color, and behavior of your particles. For example, you can have particles that move in a specific direction, change color over time, or spawn other particles.

Set up your canvas: You need to create a canvas element in your HTML to display your particles. The canvas element should be set to the size of your viewport, and you should set its position to “absolute” to ensure it overlays your UI.

Initialize your particle system: Use your chosen library to initialize your particle system and define its settings.

Render your particles: In your JavaScript code, you can use a loop to update the position and behavior of your particles and render them onto the canvas.

Add interactivity: You can add interactivity to your UI particle system by adding event listeners to your elements. For example, you can have particles spawn when a button is clicked, or change color when the mouse hovers over an element.

Overall, creating a UI particle system can add a fun and engaging element to your user interface, but it does require some programming knowledge and experience.