Resolution Independent GUI

Unity Engine
1

Hey everyone, I’m very new to the Unity3D Forums and Unity in general but I am wondering how I make the GUI in the game automatically adjust to the size of the screen no matter what the game is played on. Like say I was using a homemade iPhone game on my PC and I want it to automatically adjust to PC screen size(1920 x 1200 pixels) from the iPhone size(480 x 320 pixels). Can someone explain how to do this in detail please? Thanks in Advance.

2

I would recommend using the GUIUtility.ScaleAroundPivot() method.

3

I’m sorry? No idea how to do that. Explain please?

4

Welcome to the forum, Vection!

You might find this thread useful. It shows how to use the GUI matrix to scale the GUI to the screen resolution.

5

thank you very much, that is very helpful. I appreciate the professionalism.

6

I did it like this for my main menu:

var guiButtons : String[];
var selected = 0;
var buttonScreenModifiers : float[];
var playLoadsThisLevel : String;
//var logo : Texture2D;

//these are middle screen first button
//var rect1Pos1[] = .65, 0;
//var rect1Pos2[] = .70, 0;
//var rect1Pos3[] = .30, 0;
//var rect1Pos4[] = .20, 0;
//var GuiLabelStyle : GUIStyle;

// Keep handy reference sto our level's attributes.  We set up these references in the Awake () function.
// This also is very slightly more performant, but it's mostly just convenient.
private var levelAttributes : LevelAttributes;
private var levelBounds : Rect;

function Awake () {
	// Set up our convenience references.
	levelAttributes = LevelAttributes.GetInstance ();
	levelBounds = levelAttributes.bounds;
}
//
//private var windowRect = Rect (16, 150, 580,  480);
//private var windowRect = Rect (Screen.width-Screen.width, Screen.height*.90, 100, 100);

function OnGUI() {
	//GUI.Label (Rect (50,50, 200,100), "Label", GuiLabelStyle);
	//GUI.Box (Rect(40,40,350,150), logo);
	
	if (GUI.Button (Rect(Screen.width - (Screen.width*buttonScreenModifiers[0]), Screen.height - (Screen.height*buttonScreenModifiers[1]), Screen.width*buttonScreenModifiers[2], Screen.height*buttonScreenModifiers[3]), guiButtons[0])) {
	Application.LoadLevel(playLoadsThisLevel);
	}
	if (GUI.Button (Rect(Screen.width - (Screen.width*buttonScreenModifiers[4]), Screen.height - (Screen.height*buttonScreenModifiers[5]), Screen.width*buttonScreenModifiers[6], Screen.height*buttonScreenModifiers[7]), guiButtons[1])) {
	Application.Quit();
	}
	//windowRect = GUILayout.Window (0, windowRect, DoControlsWindow, "Welcome To Mom's Game!");	
}

//function DoControlsWindow (windowID : int) {
	//GUILayout.Label ("Make Your Selection");
	
	// Add buttons
	//selected = GUILayout.Toolbar (selected, guiButtons);
//}
// Change the width of the viewport
//function Update () {
//camera.aspect = 1.5;
//camera.rect = Rect (0, 0, 1, 1);
//}

I did this quickly and it seems to work okay for allowing me to add buttons and their location by a percent in the editor. I think a similar method can be used to just reference screen.whatever to match it to whatever resolution.