Is there any GUI Animation? Autohide etc?

UI
1

Is there any GUI animation in Unity 3D?
Something like Jquery UI.

2

There is if you program it.

–Eric

3

:smile: That would be cool :smile: :idea:

Seriously is there any? lol

4

Seriously, yes, you can do whatever you want with the GUI. If you want it to animate, program it so that it animates.

–Eric

5

What kind of animation effect are you looking for? Sliding controls, movies, fading… ?

6

I made some ‘expanding window’ things that I use for my game.

class ExpandoWindow {
	var inTime : float = 0.5;
	var outTime : float = 0.5;
	
	var position : Vector2 = Vector2(0, 0);
	var size : Vector2 = Vector2(10,10);
	
	var skin : GUISkin; //skin to draw this window with
	
	var content : GUIContent;
	
	var audioEmitter : AudioSource;
	
	var windowExpandClip : AudioClip; //it is recommended that your audio clip is NOT 3d.
	var windowCollapseClip : AudioClip;
	var makeNoise : boolean = false;
	private var hasExpanded : boolean = false;  //so that audio doesn't get called multiple times
	private var hasCollapsed : boolean = false;
	
	private var desiredColor : Color = GUI.backgroundColor;
	private var currentColor : Color;
	private var currentSize : Vector2 = size;
	private var currentPos : Vector2 = position; //moving windows to come later
	private var isExpanding : boolean = false;
	private var isBox : boolean = false;
	
	function Draw(){
		var oldSkin = GUI.skin;
		var oldColor = GUI.backgroundColor;
		GUI.skin = skin;
		if (isExpanding){
			currentSize = MathS.Vector2Lerp(currentSize, size, Time.deltaTime/inTime);
		}
		else{
			currentSize = MathS.Vector2Lerp(currentSize, Vector2.zero, Time.deltaTime/outTime);
		}
		
		//make the thing disappears if it's smaller than a certain size
		if (currentSize.x < 12.0 || currentSize.y < 12.0){
			currentColor = MathS.ColorLerp(currentColor, Color.clear, 0.1);
		}
		else{
			currentColor = MathS.ColorLerp(currentColor, desiredColor, 0.1);
		}
		GUI.backgroundColor = currentColor;
		
		currentPos = position; //moving windows to come later
		
		//now display the window
		var window : Rect = Rect(currentPos.x, currentPos.y, currentSize.x, currentSize.y);
		if (isBox){
			GUI.Box(window, content);
		}
		else{
			GUI.Label(window, content);
		}
		
		//reset gui so it doesn't affect anything outside of this class
		GUI.skin = oldSkin;
		GUI.backgroundColor = oldColor;
	}
	
	function Image(image : Texture){
		isBox = false;
		content = GUIContent(image);
	}
	function Text(text : String){
		isBox = false;
		content = GUIContent(text);
	}
	function BoxText(text : String){
		isBox = true;
		content = GUIContent(text);
	}
	
	function Expand(){
		isExpanding = true;
		//Debug.Log("expanding window" + hasExpanded + makeNoise);
		if (!hasExpanded  makeNoise  audioEmitter  windowExpandClip){
			
			audioEmitter.PlayOneShot(windowExpandClip);
		}
		hasExpanded = true;
		hasCollapsed = false;
		
	}
	function Collapse(){
		isExpanding = false;
		
		if (!hasCollapsed  audioEmitter  makeNoise  windowCollapseClip){
			audioEmitter.PlayOneShot(windowCollapseClip);
		}
		hasExpanded = false;
		hasCollapsed = true;
		//Debug.Log("collapsing window");
	}
	function Toggle(){
		isExpanding = !isExpanding;
		//Debug.Log("toggling window : " + isExpanding);
	}
}

basically you can then, in some script that is drawing gui, you make a new one like this:

private var missileWarning : ExpandoWindow = new ExpandoWindow();
missileWarning.BoxText("Missiles Incoming");
	missileWarning.size = Vector2(150, 35);
	missileWarning.position = Vector2(50, Screen.height/2);
	missileWarning.inTime = 0.1;
	missileWarning.audioEmitter = audioController.audioEmitter;
	missileWarning.makeNoise = true;
	missileWarning.skin = skin;
	missileWarning.windowExpandClip = windowExpand;

Then in your OnGUI, you need to always need to call Draw() from it. Then somewhere if you want to expand it, you call Expand(), and to make it collapse and disappear, call Collapse(). It doesn’t matter if you continuously call collapse or expand every frame, it won’t mess with the window.

so:

missileWarning.Draw(); //always call during OnGUI
//draw firedupon status
	if (firedUpon){
		missileWarning.Expand();
		audioController.playIncomingMissile();
	}
	else
		missileWarning.Collapse();

If you didn’t notice, the windows can have sound events attached to them if you assign an emitter and clip to their correct properties