Fading Scenes in unity (C#)

Posted by ZheX on 00:16
Today I'm going to show you how to fade out a scene, change to another scene and then fade back in. This can be a useful effect in many games and apps.

First off go ahead and add a new script to your Main Camera. Call it Fading. Then go ahead and setup the start variables as shown below. The fadeTexture is just a small image of the texture we want to show when fading scenes, I use/recommend a tiny black image like this one. The import settings for that image should look like this:



public Texture2D fadeTexture;
 public float fadeSpeed = 0.8f;

 private int drawDepth = -1000;
 private float alpha = 1.0f;
 private int fadeDirection = -1;

Most of these variables are quite self explanatory, so lets rush on to the next part.

void OnGUI()
 {
  alpha += fadeDirection * fadeSpeed * Time.deltaTime;
  alpha = Mathf.Clamp01(alpha);

  GUI.color = new Color (GUI.color.r,GUI.color.g,GUI.color.b,alpha);
  GUI.depth = drawDepth;
  GUI.DrawTexture(new Rect(0,0,Screen.width,Screen.height),fadeTexture);
 }

This simply fades the black texture's opacity. If the fadeDirection is negative one, it gets less and less visible, and if it's one the black texture gets increasingly visible. The drawDepth part makes sure that the black texture is being shown above everything else. Now lets move on to the last bit of code in the Fading script.

public float StartFade(int direction)
 {
  fadeDirection = direction;
  return fadeSpeed;
 }

 void OnLevelWasLoaded()
 {
  StartFade(-1);
 }

The first function StartFade is what we need to call with a positive direction value to actually fade out. The second one is a function that will run automatically when the scene is loaded, it removes the black texture.

Now for the final part, which makes it all work.
You will need to put this part in the place where you load up another scene. E.g a button, a timer of an object a player collects.

IEnumerator FadeScene()
 {
  float fadeTime = Camera.main.GetComponent().StartFade(1);
  yield return new WaitForSeconds(fadeTime);
  Application.LoadLevel( (Application.loadedLevel+1));
 }

Whenever you want to fade a scene out you just call that function by typing this:

StartCoroutine(FadeScene());

Happy fading!


For reference, here is my whole Fading.cs file:
using UnityEngine;
using System.Collections;

public class Fading : MonoBehaviour {

 public Texture2D fadeTexture;
 public float fadeSpeed = 0.8f;

 private int drawDepth = -1000;
 private float alpha = 1.0f;
 private int fadeDirection = -1;

 void OnGUI()
 {
  alpha += fadeDirection * fadeSpeed * Time.deltaTime;
  alpha = Mathf.Clamp01(alpha);

  GUI.color = new Color (GUI.color.r,GUI.color.g,GUI.color.b,alpha);
  GUI.depth = drawDepth;
  GUI.DrawTexture(new Rect(0,0,Screen.width,Screen.height),fadeTexture);
 }

 public float StartFade(int direction)
 {
  fadeDirection = direction;
  return fadeSpeed;
 }

 void OnLevelWasLoaded()
 {
  StartFade(-1);
 }
}

and my button, that loads up the next level:
StartGame.cs
using UnityEngine;
using System.Collections;

public class StartGame : MonoBehaviour {

 void OnMouseDown()
 {
  StartCoroutine(FadeScene());
 }

 IEnumerator FadeScene()
 {
  float fadeTime = Camera.main.GetComponent().StartFade(1);
  yield return new WaitForSeconds(fadeTime);
  Application.LoadLevel( (Application.loadedLevel+1));
 }
}

Categories: