- Home /
What's the best way to fade a scene to black?
Usually, I'd set up a UI canvas with a quad fader permanently on top of the game view. This is connected to an animator, with four states (black opaque, white opaque, black transparent, white transparent) in Mecanim, then I'd call transitions between these states etc as required.
However, recently (and I can't find this page at the moment, sorry) - I read something to the effect that this methodology was substantially expensive and that it would be better to do everything through a custom shader.
Is this true? If so, can anybody give me some advice on how to best achieve this? I'm about to start working on a couple of games that need this kinda infrastructure, and I'd like to avoid making the same mistakes if at all possible.
Answer by Bip901 · Jun 29, 2019 at 09:05 AM
If your setup matches the screenshot below (a stretched image on an overlay canvas) and you only activate that gameobject when you need to fade, there's no problem. If, however, you use the fade very frequently or experience performance issues with it, you might want to use a custom shader.
(Custom shader below the screenshot)
Creating a custom shader
Attach the following component to your main camera. This script lets you modify the image seen by the camera before it's rendered to the screen, by passing it through a material of your choice.
using UnityEngine;
public class PostProcessor : MonoBehaviour
{
private Material material; //assign this in the inspector
private void OnRenderImage(RenderTexture source, RenderTexture destination)
{
Graphics.Blit(source, destination, material);
}
}
This (untested) shader lets you modify the fade amount using a single number, "_FadeAmount". Create a new material which uses this shader and assign it to the material field of PostProcessor. If you want more control over the effect, you can replace the number with a color you multiply by.
Shader "PostProcessing/ScreenFader"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_FadeAmount("Fade Amount", Range(0, 1)) = 0
}
SubShader
{
// No culling or depth
Cull Off ZWrite Off ZTest Always
Pass
{
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};
struct v2f
{
float2 uv : TEXCOORD0;
float4 vertex : SV_POSITION;
};
v2f vert (appdata v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv = v.uv;
return o;
}
sampler2D _MainTex;
float _FadeAmount;
fixed4 frag (v2f i) : SV_Target
{
fixed4 col = tex2D(_MainTex, i.uv);
col.rgb *= _FadeAmount;
return col;
}
ENDCG
}
}
}
Good christmas, what a great answer. To just check your point above, could I just disable the Image component ins$$anonymous$$d of Setting the GameObject inactive? Either way, incredibly valuable answer, complete answer, thanks. I did not expect someone to write me a shader...!
Hey, no problem! About the disabling: disabling only the image component is cheaper than disabling the whole gameobject, so yeah, you certainly can!
Your answer
![](https://koobas.hobune.stream/wayback/20220612204032im_/https://answers.unity.com/themes/thub/images/avi.jpg)