positioning gui!

Questions & Answers
1

hello! i have some gui in my game that i would like to be placed in the bottom-center of the screen, and in-game at my monitor’s resolution (1600x900), it looks fine -

alt text

but at 640x480 it looks like this -

alt text

at other resolutions it’s position is obviously wrong, but i chose 640x480 for some reason.

the code i’m using to draw both the text and the textbox -

GUI.DrawTexture(Rect(Screen.width/2.65,Screen.height / 2,446,202), tex);
GUI.contentColor = Color.black;
GUI.skin = s;
GUI.Label(Rect(Screen.width/2.5,Screen.height / 1.85,446,202),"text!");

if anyone could help out, that would be tremendously grateful, as i’m doing this for a jam!

thanks

2

Hello,

When making relative UI, you need t make every argument relative. Right now you only have the position relative, but your size is constant.
Make your size relative as well and that will fix your problem.

Also, a nice tip with positioning is to use re-readablel positions. /1.85 is just a random constant, however if you wrote /37*20, which means splitting the sreen into 37 rows and going down 20. That will also make positioning other elements easier as well as making the code more readable.

Another good tip, is that currently you are doing integer division. That means you will have rounding issues and in some cases quite bad inaccuracies. I suggest (for ease), you make a temporaty float type variable to represent width and height, so that your calculations will me more accurate.

Hope this helps,
Benproductions1

3

I was facing same issue. But i have solved by using this code. You can try below code:

private var w = 0.3; // proportional width (0..1)
private var h = 0.2; // proportional height (0..1)
private var rect: Rect; 
static var WIDTH : float = 1024;
static var HEIGHT : float= 768;
static var stack : List.<Matrix4x4> = new List.<Matrix4x4>();

function OnGUI()
{
	stack.Add (GUI.matrix);
        var m : Matrix4x4= new Matrix4x4 ();
        var w : float = Screen.width;
        var h : float = Screen.height;
        var aspect = w / h;
        var scale = 1f;
        var offset = Vector3.zero;
        if(aspect < (WIDTH/HEIGHT)) { //screen is taller
            scale = (Screen.width/WIDTH);
            offset.y += (Screen.height-(HEIGHT*scale))*0.5f;

        } else { // screen is wider
            scale = (Screen.height/HEIGHT);
            offset.x += (Screen.width-(WIDTH*scale))*0.5f;
        }
        m.SetTRS(offset,Quaternion.identity,Vector3.one*scale);
        GUI.matrix *= m;

        GUILayout.BeginArea (Rect (WIDTH * 0.15,HEIGHT * 0.5 - 700,1400,1000)); //do not use Screen.width and Screen.height..
        GUILayout.EndArea();

        GUI.matrix = stack[stack.Count - 1];
        stack.RemoveAt (stack.Count - 1);
}