How can I draw a ParticleSystem over the new Unity 4.6 UI?

I want to play a particle system (of 2D sprites) in the UI I am currently making, using Unity 4.6 beta’s new UI system. The UI has a solid colour background so I need to somehow modify the draw order such that the particles play on top, but I am not sure how to do this.

Here are some things I’ve tried:

  1. Changing the Z position in the inspector.
  2. Changing the Layer in the inspector.
  3. Changing the Sorting Layer programmatically via an attached script.
  4. Parenting the ParticleSystem to a Canvas and overriding its Sort Order.
  5. Changing the shader used by the ParticleSystem.

Nothing seems to work so I must be doing something wrong. Does anyone know how to make the ParticleSystem draw in front of the UI?

In Render Mode of your Canvas, place ScreenSpace - Camera with Main Camera in Render Camera.

Canvas Render mode to “Screen Space-Camera”

Add Sorting Layer
Keep all sorting layer at order in layer “default” “0”
Animation canvas at higher number.

This has worked for me. It does not work if any canvas have order number non-zero(probably a bug)

It’s actually pretty simple once you get it figured out. There’s a few different approaches you can take; here’s one:

  1. Create new scene.
  2. Set camera projection to ortho. Leave its position at 0, 0,
  3. Create your canvas, add some elements if desired.
  4. Set canvas’ render mode to World Space (this makes it easier to anchor particle systems to canvas elements, since canvas element positions are all relative.)
  5. Set canvas’ position to 0, 0, 500. Don’t worry, the canvas won’t shrink. I’m setting its posZ to 500 since my particle system ejects particles along all 3 axes
  6. Jump back to the camera, increase its Size property until it encapsulates the entire canvas in the game view.
  7. Create particle system, set its position to 0, 0, 0.
  8. Increase Start Size of particle system, since it may be too small to be seen easily. I set mine to 100.
  9. Test your scene. If the particles are being hidden shortly after spawning, or if you’re having any other visibility issues, set the viewport to 3D to help you get your bearings. Be mindful of the rotation of your particle system, especially if you’re throwing particles along a specific vector.
  10. Here is a gameview screenshot of my final result:

Particles will be foreground to other UI element’s if you do the following steps:

Also you can use this addon:

A world space canvas works. Not ideal, but it works.

Two cameras worked for me, as per this thread:

Make a new layer just for UI particle effects, make a camera that only renders that without clearing, and make this “UI Particles Camera” depth higher so it is rendered on top of the main camera. In my case UI particle cam depth 1, main camera -1. Have main camera ignore UI particles layer.

While it did work, i found it annoying getting the effects to line up, but not impossible.

I’ve answered this question in this topic:

I Know this a fairly old post but I came across it when I was looking for a solution to using Particle Systems with a Canvas set to Screen Space - Overlay

The way I got this to work was to put a second Camera in the scene and make it a Child of the Canvas and set the new Camera to 0,0,0 then I moved the new Camera on the Z Axis until the Camera FOV representation intersected with the Canvas.

As mentioned above by LordYabo, I made a new Layer called “UI Particle Effects”

New Camera Settings:
Clear Flags = Depth Only,
Culling Mask = UI Particle Effects only,
Depth = +1.

The only change I made to the Main Camera is I unselected UI Particle Effects from the Culling Mask.

Neither Screen Space - Camera nor World Space Canvas’ would work for what I wanted to do with my UI so this was the solution for me.

Hope this helps someone in the future.

I’ve just released UI Particles package for uGUI.

It’s a simple drag&drop solution for particles in UI. Not required second camera, work with all type of canvases. Work with sorting inside canvas. And compatible with mobile.

You can try particle2D plugin Unity Asset Store - The Best Assets for Game Making

Attach the particle system to your camera.

I found this by chance, but it seems to work:

Go to the Particles System ‘Renderer’ tab and increase the ‘Order in Layer’ property (from 0 to 1, should be enough).