Intro to Unity GUI

This post contains an solutions  to my Unity programming exercises and classes I showed at the lectures. This post cover coding some basic things about using Unity GUI system.

StartScreenGUI (C#)

This class creates simple re-sizable and skinnable start screen for a game with main screen, credits screen, and confirm screen for quitting. The main screen is show in the Figure (with the textures and skin setup).

public class StartScreenGUI : MonoBehaviour {

	public Texture2D menuBackground;
	public Texture2D title;
	public Texture2D lookAtHelp;
	public Texture2D moveHelp;
	public GUISkin mySkin;
	public string nextLevel;

	private enum MenuStates { MAIN, CREDITS, CONFIRM_QUIT };
	private MenuStates currState;
	private string currLevel;

	// Use this for initialization
	void Awake () {
		currState = MenuStates.MAIN;
	}

	void OnGUI() {
		GUI.matrix = GUIGlobals.GetGUIMatrix();
		if(mySkin) {
			GUI.skin = mySkin;
		}
		if(menuBackground) {
			GUI.DrawTexture(new Rect(0,0,GUIGlobals.screenWidth, GUIGlobals.screenHeight), menuBackground);
		}
		switch(currState) {
		case MenuStates.MAIN:
			DrawMainScreen();
			break;
		case MenuStates.CREDITS:
			DrawCredits();
			break;
		case  MenuStates.CONFIRM_QUIT:
			DrawConfirmQuit();
			break;
		default:
			Debug.LogError("StartScreenGUI.OnGUI(): Unknown MenuStates: reverting to MenuStates.MAIN");
			DrawMainScreen();
			break;
		}
	}

	private void DrawMainScreen() {
		GUI.DrawTexture(new Rect(20,20, 512, 101), title);

		GUI.Label(new Rect(GUIGlobals.screenWidth-600,200,200,100), "Turn", "Help Centered");
		GUI.Label(new Rect(GUIGlobals.screenWidth-400,330,200,100), "Hold to\nbe invisible", "Help Left Aligned");
		GUI.DrawTexture(new Rect(GUIGlobals.screenWidth-600,250, 200,200), lookAtHelp);

		GUI.DrawTexture(new Rect(GUIGlobals.screenWidth-350, 80, 256,160), moveHelp);
		GUI.Label(new Rect(GUIGlobals.screenWidth-350, 240, 256,100), "Move", "Help Centered" );

		GUILayout.BeginArea(new Rect(0, 600, GUIGlobals.screenWidth, 60));
		GUILayout.BeginHorizontal();
		GUILayout.FlexibleSpace();
		if(GUILayout.Button("Start")) {
			Application.LoadLevel(1);
		}
		GUILayout.Space(20);
		if(GUILayout.Button("Credits")) {
			currState = MenuStates.CREDITS;
		}
		GUILayout.Space(20);
		if(GUILayout.Button("Quit")) {
			currState = MenuStates.CONFIRM_QUIT;
		}
		GUILayout.FlexibleSpace();
		GUILayout.EndHorizontal();
		GUILayout.EndArea();
	}

	private void DrawCredits() {

		GUILayout.BeginArea(new Rect(0, 200, GUIGlobals.screenWidth, 100));
		GUILayout.BeginHorizontal();
		GUILayout.FlexibleSpace();
		GUILayout.BeginVertical();
		GUILayout.Label("Made by", "bold");
		GUILayout.Label("Petri Lankoski", "MainText");
		GUILayout.EndVertical();
		GUILayout.FlexibleSpace();
		GUILayout.EndHorizontal();
		GUILayout.EndArea();

		GUILayout.BeginArea(new Rect(0, 700, 1280, 60));
		GUILayout.BeginHorizontal();
		GUILayout.FlexibleSpace();
		if(GUILayout.Button("Back")) {
			currState = MenuStates.MAIN;
		}
		GUILayout.FlexibleSpace();
		GUILayout.EndHorizontal();
		GUILayout.EndArea();
	}

	private void DrawConfirmQuit() {

		GUILayout.BeginArea(new Rect(0, 200, 1280, 400));
		GUILayout.BeginHorizontal();
		GUILayout.FlexibleSpace();
		GUILayout.Label("Do you want to Quit?", "MainText");
		GUILayout.FlexibleSpace();
		GUILayout.EndHorizontal();
		GUILayout.EndArea();

		GUILayout.BeginArea(new Rect(0, 700, 1280, 60));
		GUILayout.BeginHorizontal();
		GUILayout.FlexibleSpace();
		if(GUILayout.Button("Yes")) {
			Application.Quit();
		}
		GUILayout.Space(20);
		if(GUILayout.Button("No")) {
			currState = MenuStates.MAIN;
		}
		GUILayout.FlexibleSpace();
		GUILayout.EndHorizontal();
		GUILayout.EndArea();
	}
}

GUIGlobal (C#)

This class offers static function and const to set up GUI.matrix and getting the screen size for drawing. This class cannot be attached to any game object, but is accessed like GUI.matrix = GUIGlobals.GetGUIMatrix();. With setup presented below, the layout is done to screen size 1280×800.

public class GUIGlobals {
	public const float screenWidth = 1280.0f;
	public const float screenHeight = 800.0f;

	public static Matrix4x4 GetGUIMatrix() {
		float xScale = Screen.width / screenWidth;
		float yScale = Screen.height / screenHeight;
		return Matrix4x4.TRS(
			Vector3.zero,
			Quaternion.identity,
			new Vector3(xScale, yScale, 1)
		);
	}
 }

(The post is is licensed under a Creative Commons Attribution 3.0 Unported License).