Stop Post-Processing Effects on UI?

Question

Using Standard Asset Package > Effects > Image Effects > TiltShift (but would like to know for any effects)

I have attached TiltShift to my Main Camera, it makes the background look really good; however, the UI is also getting blurred.

How can I stop this from happening?

Screenshot: http://i.imgur.com/k0cprEs.jpg

Answer 1

Best Answer

Answer by TheDJBuntin · Feb 02, 2017 at 12:12 AM

Figured it out... Although I don't fully understand it, this fixes it.

Basically previously my Canvas was setup like this: http://i.imgur.com/5dqb14V.png With Rendermode set as Screen Space - Camera.

I simply change it to screenspace overlay and the blur is removed. New settings: http://i.imgur.com/0tYYLT3.png

Add comment · Show 1 · Share

abeldantas · May 29, 2018 at 02:55 PM 3

Share

This is not a solution. You may in fact need to use Screen Space - Overlay. Like when rendering UI elements underneath 3d objects.

Answer 2

Answer by sthekken · Jul 17, 2020 at 01:21 PM

Setting the render mode to Screen Space - Overlay might work for many people, but for those who have custom shaders that need a camera this may be an alternate solution, if you're using the Universal Render Pipeline:

Create a duplicate of the Main Camera, Call it UI Camera.
Remove all scripts and the audio listener from the UI Camera.
Uncheck Post-Processing on the UI Camera.
Set the UI Camera as a child of the Main Camera and reset its transform.
Use the UI Camera as the source for the Canvas in Screen Space - Camera mode
Set the Main Camera to have Render Type - Base (which is default).
Set the UI Camera to have Render Type - Overlay.
Add the UI Camera to the Stack in the Main Camera.
Uncheck UI from the Main Camera's Culling Mask.
Uncheck everything except UI from the UI Camera's Culling Mask.

This should keep the UI rendering on top of everything else, while still benefiting from the camera space rendering, while ignoring the Post Processing.

Hope this helps, it worked for my case (adding a blur element to the UI).

Add comment · Show 3 · Share

obaydaSSJ · Dec 04, 2020 at 08:33 PM 0

Share

Your solution is great, thank you so much it's work perfectly on windows I will be more thankful if you tell me how to make this way work on mobile!

Vampiressae · Apr 28 at 11:11 AM 0

Share

This works perfectly, however if you put some color grading effects (i.e. Channel Mixer) in the post-processing profile, those will apply on both cameras... the other effects (i.e. Chromatic Aberration) don't.

Any thoughts how I could solve this, so the UI camera will not be affected by any of those effects?

LilGames · May 25 at 09:19 PM 0

Share

This may be fine on desktop computers and perhaps really high-end tablets but it's gonna kill performance on mobile devices in general (especially Android).

Answer 3

Answer by Kazkadez · Jul 31, 2017 at 01:06 PM

If you're not using more than 1 Camera, just remove the Main Camera object under Render Camera when you're in Screen Space - Camera. The Render Camera picks up all of the post processing scripts the object you put in there. The UI will automatically overlay over the main camera but this way it won't pick up the post processing scripts.

Add comment · Show 2 · Share

jsleek · Jun 07, 2018 at 07:05 PM 0

Share

What do you mean by Render Camera? What is Render Camera?

LilGames jsleek · May 25 at 09:24 PM 0

Share

They mean that on the Canvas setting where you link / reference which camera to use for Screen Space Camera, you delete it and leave it with "None".

Yes, this has the effect of not applying Post Processing. However if you depend on layer sorting so that some things render behind that canvas and other things render on top (eg: particles) then you lose that too. You might as well use "Screen Space Overlay" since it seems to default to that behaviour when there is no camera reference.

Stop Post-Processing Effects on UI?

3 Replies

Your answer

Follow this Question

Related Questions