Fade SkyBox to Black

I’m trying to change the color tint on my Skybox so that it fades to black. However it does not manage to fade the SkyBox completely black.

While researching I have found the SkyBox Blended script ( http://wiki.unity3d.com/index.php?title=SkyboxBlended ), but it seems a lot to do just to fade to black. Also I have no experience of Shaders and tried to implement it with little luck, but will give it another go if it’s the only way.

Is this pretty much the only other way, or does anyone have an alternate suggestion.

Thanks

Paul

3 Answers

3

Right, so I’ve noticed that Game Development seems to be a lot of ‘Smoke and Mirrors’. I was only looking for a smooth transition from one skybox to another with a simple fade to black and then fade in the new skybox.

So I thought why not surround my scene with some flat planes that create a box with all 6 sides. I then used a transparent texture set to black.

So when I changed the skybox on a keypress it simply fades in the black box, changes the skybox when it’s no longer visible, and then fade the box out again… and it works great! I am using iTween for the fade by the way.

I’m sure there is probably a more elegant way to do this but I have only been using unity for a few months, but for what it’s worth Here is my script. Enjoy:

//Choose your skyboxes in the inspector
var StartSkyBox:Material;
var mat1:Material;
var mat2:Material;
var mat3:Material;
var mat4:Material;
var mat5:Material;

//This is the parent of the giant box created using 6 planes with a black transparent texture. Select it in the inspector.
var SkyBoxMaskObject : GameObject;

//Default Skybox to start with
RenderSettings.skybox=StartSkyBox;


//Functions for each skybox
function swapskybox1()
	{
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":1,"time":1});
		yield WaitForSeconds(1);
		RenderSettings.skybox=mat1;
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":0,"time":1});
	}


function swapskybox2()
	{
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":1,"time":1});
		yield WaitForSeconds(1);
		RenderSettings.skybox=mat2;
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":0,"time":1});
	}

		
function swapskybox3()
	{
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":1,"time":1});
		yield WaitForSeconds(1);
		RenderSettings.skybox=mat3;
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":0,"time":1});
	}
	
	
function swapskybox4()
	{
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":1,"time":1});
		yield WaitForSeconds(1);
		RenderSettings.skybox=mat4;
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":0,"time":1});
	}
	
	
function swapskybox5()
	{
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":1,"time":1});
		yield WaitForSeconds(1);
		RenderSettings.skybox=mat5;
		iTween.FadeTo(SkyBoxMaskObject,{"alpha":0,"time":1});
	}


function Update(){


			if(Input.GetKeyDown(KeyCode.Keypad1)) {
				Debug.Log("Keypad 1 pressed");				

				//Call the change skybox function
				swapskybox1();
				
				}
				
				
			if(Input.GetKeyDown(KeyCode.Keypad2)) {
				Debug.Log("Keypad 2 pressed");
				
				//Call the change skybox function
				swapskybox2();
				
				}
				
			if(Input.GetKeyDown(KeyCode.Keypad3)) {
				Debug.Log("Keypad 3 pressed");
				
				//Call the change skybox function
				swapskybox3();
				
				}
				
			if(Input.GetKeyDown(KeyCode.Keypad4)) {
				Debug.Log("Keypad 4 pressed");
				
				//Call the change skybox function
				swapskybox4();
				
				}
				
			if(Input.GetKeyDown(KeyCode.Keypad5)) {
				Debug.Log("Keypad 5 pressed");
				
				//Call the change skybox function
				swapskybox5();
				
				}


}

You could have only one function and an array of materials: var index:int; var mat:Material[]=new Material[6]; function Update(){ if(Input.GetKeyDown(KeyCode.Keypad1)) { index = 0; Swapskybox(index); } } function Swapskybox(i:int){ iTween.FadeTo(SkyBoxMaskObject,{"alpha":1,"time":1}); yield WaitForSeconds(1); RenderSettings.skybox=mat*;* iTween.FadeTo(SkyBoxMaskObject,{"alpha":0,"time":1}); }

–

That's neat! A number of new ways to do stuff. Thanks fafase!

–

Looking at it, it will be much easier to add or remove new skyboxes. Yes?

–

Yep that's it fafase. Great stuff! It's opened my eyes to other more efficient ways.

–

You could have different skyboxes for instance four of them and you can use this http://wiki.unity3d.com/index.php?title=SkyboxBlended to pass from one to the other.

Well, if you want an easy way but not the best maybe…

var sky:Skybox;
var skies:Material[6];
var i:int =0;
function Start () {
sky= gameObject.GetComponent(Skybox);
}

function Update () {
  if(Input.GetKeyDown(KeyCode.Space)){
    RenderSettings.skybox = skies*;*

i++;
if(i==6)i=0;
}
}
Consider you have the same skybox 6 times (…)from balck to white to black with little changing between each. Then when pressing space you swap from one to the next. At the end you get back to the first you did a full day. If your game has building you get in, you could do that when you are inside so the change won’t be brutal to the gameplay.

I have already mentioned that I looked at this in the original question fafase, but thanks anyway :)

–

oops my bad...

–

lol! No problem ;)

–

I also updated my answer with another way n case you need a scripting way.

–

Thanks fafase! I'll up vote your reply as it is a solution, but I needed something a little smoother ;)

–

If you just want to turn something to black - create a texture, and alter the alpha of it, like this

    public Texture blackBackground;
    
    	public float Speed = 0.1f;
    	private Rect backgroundRect = new Rect(0,0,Screen.width,Screen.height);
    	private float alphaBackground = 0;
    
    	public void OnGUI()
    	{
    		GUI.depth = 0;	//-- on top
    		alphaBackground += (Speed / 10f)* Time.deltaTime;
    		GUI.color = new Color(0,0,0, alphaBackground);
    		GUI.DrawTexture (backgroundRect, blackBackground);
    }

Remember to assign the blackBackground to a black texture (png) in the IDE. (look in the script you have created, after inserting this code)…

26819-blackunity.png

Also note - if you are using OnGUI for mobile devices, be careful as its expensive. It will work, just watch out… :wink: