x


Rendering GUI.Buttons in the middle of the screen

Hey I am having some trouble with my GUI. In my main menu they buttons render in the middle of the screen, but if I switch to a widescreen or change the resolution the buttons move and sometimes you can't even see them. Does anyone know how to fix this?

more ▼

asked Feb 04 '10 at 03:36 AM

user-860 (yahoo) gravatar image

user-860 (yahoo)
31 4 4 7

(comments are locked)
10|3000 characters needed characters left

4 answers: sort voted first

Depends on how you placed your buttons. With GUIText and GUITexture, the "Pixel Offset"/"Pixel Inset" parameters are problematic, since they are pixel based, and therefore, placement of your GUI elements will depend on your screen resolution.

I wrote a little wrapper script, which normalizes screen positions to -0.5..0.5, and also takes care of the aspect ratio, and translates these values to pixel offsets depending on your screen resolution. This way, you can place your GUI elements consistently for any screen size.

In essence, you need to do something like (C# example for GUIText):

public float X;
public float Y;

    ...

    float Xcoord=X*Screen.width;
    float Ycoord=Y*Screen.height;

    // do we have a GUIText?
    GUIText guiText=GetComponent<GUIText>();
    if(guiText){
        // translate to normalized position
        guiText.pixelOffset=new Vector2(Xcoord,Ycoord);
    }
more ▼

answered Feb 25 '10 at 04:49 PM

Wolfram gravatar image

Wolfram
9k 8 20 52

Wow totally awesome!! Thank you Wolfram, it worked beautifully!!!

Jul 03 '10 at 09:11 AM agentsmith

where is this script supposed to be implemented???

Oct 22 '10 at 11:24 AM Juri

You need to set these only at initialisation time, so Awake() or Start() will do.

Oct 25 '10 at 01:05 PM Wolfram
(comments are locked)
10|3000 characters needed characters left

I usually just grab the width and height from the Screen.width and Screen.height. This gives me the current resolution. You can do this in the top of your OnGUI even or just store them in variables that you update when you switch resolution.

To center elements, you'll need to know the width and height of your element to center.

Formular is rather simple:

int xpos = (Screen.width)-(this_element.width)/2;
int ypos = (Screen.height)-(this_element.height)/2;
more ▼

answered Aug 04 '11 at 11:04 PM

BerggreenDK gravatar image

BerggreenDK
2.4k 54 62 75

(comments are locked)
10|3000 characters needed characters left

With Screen.width you can access the width of your screen in pixels. Divide that by half and you have the exact middle of your screen. Position the buttons at the appropriate spot by taking a certain percentage of the screen width (e.g. placing them around 45% of your screen width). That should keep them in the middle no matter what your resolution is.

more ▼

answered Feb 04 '10 at 04:44 AM

Sebas gravatar image

Sebas
4k 12 18 45

That will not in fact, in Unity the textures are positioned by there lower left corner so they will not be centered.

Aug 31 '12 at 01:34 AM landon91235
(comments are locked)
10|3000 characters needed characters left

In C# Script:

if(GUI.Button(new Rect(Screen.width / 2 - 100, Screen.height / 2 - 100, 200, 50)
{
    //Enter Code here
}
more ▼

answered Aug 29 '12 at 09:00 PM

KFVex gravatar image

KFVex
1

(comments are locked)
10|3000 characters needed characters left
Your answer
toggle preview:

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Topics:

x3669
x477
x378
x88

asked: Feb 04 '10 at 03:36 AM

Seen: 5237 times

Last Updated: Aug 31 '12 at 01:34 AM