x


how to fade in/out a scene?

how do i fade in a scene from a black screen to a skybox? later i want to crossfade the first skybox to a second skybox. finally i want to fadeout the second skybox to a white screen. how do i do that? thanks, flexrails

more ▼

asked Dec 02 '09 at 12:50 PM

flexrails gravatar image

flexrails
706 29 35 55

(comments are locked)
10|3000 characters needed characters left

6 answers: sort voted first

You'd do the fading to white/black placing a single-colored texture across your screen, and changing the alpha value of it over time so that it fades in, or fades out.

There are a number of different ways of placing this texture on-screen, you could:

  • Use the older method of GUITexture GameObjects from the menu (GameObject -> Create Other -> GUI Texture)
  • Place a plane in front of your camera, or render one using a 2nd camera in your scene
  • Use the newer GUI scripting system to draw the texture

The code you'd use for the 3rd option above might look something like this. You'd start the alphaFadeValue at 1, and the "/ 5" is so the fade lasts 5 seconds.

alphaFadeValue -= Mathf.Clamp01(Time.deltaTime / 5);

GUI.color = new Color(0, 0, 0, alphaFadeValue);
GUI.DrawTexture( new Rect(0, 0, Screen.width, Screen.height ), blackTexture );
more ▼

answered Dec 02 '09 at 01:03 PM

duck gravatar image

duck ♦♦
41k 92 148 415

(comments are locked)
10|3000 characters needed characters left

To fade between two different sets of skybox textures, there's a shader on the Wiki designed to do exactly this, here:

http://www.unifycommunity.com/wiki/index.php?title=SkyboxBlended

more ▼

answered Dec 02 '09 at 01:04 PM

duck gravatar image

duck ♦♦
41k 92 148 415

it says that it requires minimum hardware. how would i do 2 skyboxes without that minimum hardware?

Dec 02 '09 at 01:30 PM flexrails

I think these are pretty low-spec hardware requirements. It says "GeForce 3". According to Wikipedia, the GeForce 3 series were introduced in 2001, and were superceded in 2002 by the GeForce 4 series. If you really needed to achieve this on very old hardware, you would probably need to create your own skybox system, where you draw the skybox twice, once with the first skybox texture, then again with the 2nd texture using an alpha-blended shader. You would probably want to use an additional camera in your scene dedicated to this task, so that it gets drawn behind everything else.

Dec 02 '09 at 01:59 PM duck ♦♦
(comments are locked)
10|3000 characters needed characters left

I've just been working on the same thing.

I've adapted the wiki shader mentioned above so that it can be used on older machines. It's very similar to the original - I just manged to get rid of one 'set texture' so it can be used on all but the oldest machines (the only Unity emulation mode that doesn't support it is 'dinosaur'). Older machines will show the first skybox only.

Shader "Custom/Skybox" {

Properties {
    _Tint ("Tint Color", Color) = (.5, .5, .5, .5)
    _FrontTex ("Front (+Z)", 2D) = "white" {}
    _BackTex ("Back (-Z)", 2D) = "white" {}
    _LeftTex ("Left (+X)", 2D) = "white" {}
    _RightTex ("Right (-X)", 2D) = "white" {}
    _UpTex ("Up (+Y)", 2D) = "white" {}
    _DownTex ("Down (-Y)", 2D) = "white" {}
    _FrontTex2("2 Front (+Z)", 2D) = "white" {}
    _BackTex2("2 Back (-Z)", 2D) = "white" {}
    _LeftTex2("2 Left (+X)", 2D) = "white" {}
    _RightTex2("2 Right (-X)", 2D) = "white" {}
    _UpTex2("2 Up (+Y)", 2D) = "white" {}
    _DownTex2("2 Down (-Y)", 2D) = "white" {}
    _Color ("Fade (use alpha)", Color) = (1,1,1,1)
}

SubShader {
    Tags { "Queue" = "Background" }
    Cull Off
    ZWrite On
    ZTest Always
    Fog { Mode Off }
    Lighting Off       
    Color [_Tint]
    Pass {
        SetTexture [_FrontTex] { combine texture }
        SetTexture[_FrontTex2] { 
            constantColor [_Color]
            combine texture lerp (constant) previous
        }
    }
    Pass {
        SetTexture [_BackTex] { combine texture }
        SetTexture[_BackTex2] { 
            constantColor [_Color]
            combine texture lerp (constant) previous
        }
    }
    Pass {
        SetTexture [_LeftTex] { combine texture }
        SetTexture[_LeftTex2] { 
            constantColor [_Color]
            combine texture lerp (constant) previous
        }
    }
    Pass {
        SetTexture [_RightTex] { combine texture }
        SetTexture[_RightTex2] { 
            constantColor [_Color]
            combine texture lerp (constant) previous
        }
    }
    Pass {
        SetTexture [_UpTex] { combine texture }
        SetTexture[_UpTex2] { 
            constantColor [_Color]
            combine texture lerp (constant) previous
        }
    }
    Pass {
        SetTexture [_DownTex] { combine texture }
        SetTexture[_DownTex2] { 
            constantColor [_Color]
            combine texture lerp (constant) previous
        }
    }
}

Fallback "RenderFX/Skybox", 1
}

To animate between one texture and the next:

private var thisMaterial : Material;
private var fadeSpeed : float = 0.4;

function Start (){
    thisMaterial = RenderSettings.skybox;
    thisMaterial.color.a = 0.0;
}

function Update () {
    thisMaterial.color.a += (fadeSpeed * Time.deltaTime); 
    thisMaterial.color.a = Mathf.Clamp(thisMaterial.color.a, 0.0, 1.0);
}

To fade from the second skybox to the first skybox start with thisMaterial.color.a=1.0; and use -= instead of +=

To change what you are fading to and from simply change the material variables. Eg, to fade from black to the second skybox texture:

public var blackTexture : Texture2D;

function Start (){
    thisMaterial = RenderSettings.skybox;
    thisMaterial.color.a = 0.0;

    thisMaterial.SetTexture("_FrontTex", blackTexture);
    thisMaterial.SetTexture("_BackTex", blackTexture);
    thisMaterial.SetTexture("_LeftTex", blackTexture);
    thisMaterial.SetTexture("_RightTex", blackTexture);
    thisMaterial.SetTexture("_UpTex", blackTexture);
    thisMaterial.SetTexture("_DownTex", blackTexture);
}
function Update () {
    thisMaterial.color.a += (fadeSpeed * Time.deltaTime); 
    thisMaterial.color.a = Mathf.Clamp(thisMaterial.color.a, 0.0, 1.0);
}

To fade between different skyboxes set the different textures like we did above, but this time with your skybox textures, not a single black texture. For the second set of textures use

thisMaterial.SetTexture("_FrontTex2", textureVariable);
etc
more ▼

answered Jan 16 '10 at 09:07 PM

Miriam gravatar image

Miriam
119 3 3 12

how sad that none of our newer answers get the attention they deserve... :)

Nov 03 '10 at 10:19 PM fireDude67
(comments are locked)
10|3000 characters needed characters left

to crossfade between two skyboxes, you could create two skyboxes, one slightly bigger than the other so that it encompasses the other. Then you could fade the inner one's alpha to make it fade in or out.

more ▼

answered Dec 02 '09 at 04:55 PM

Azound gravatar image

Azound
668 19 22 39

(comments are locked)
10|3000 characters needed characters left

You can crossfade between 2 materials with the Lerp method: http://docs.unity3d.com/Documentation/ScriptReference/Material.Lerp.html

more ▼

answered Jul 09 '12 at 03:29 PM

ellens gravatar image

ellens
90 1 3

Note that that method will only interpolate float and Color values - it will not interpolate shader rendering or textures.

It would, however, be okay to fade from a solid color to a texture.

Sep 19 '12 at 07:01 AM rhys_vdw
(comments are locked)
10|3000 characters needed characters left
Your answer
toggle preview:

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Topics:

x1656
x491
x162
x82

asked: Dec 02 '09 at 12:50 PM

Seen: 22922 times

Last Updated: Sep 19 '12 at 07:01 AM