Bulletproof way to do resolution independant GUI scaling?

Question

I'm having a really hard time getting GUI scaling to work. I'm working on a base resolution of windowed 1024x768 and I find that whenever I change the resolution all of my GUI elements get moved around and it pretty much breaks my game. I want to give users the ability to run at whatever resolution they want so this is a big issue.

I've searched around and I've seen a lot of solutions involving changing the GUI Matrix in the OnGUI function but my game just uses GUITextures with scripts attached, so OnGUI never gets called.

Is there any solution?

Answer 1

Best Answer

Answer by SilverTabby · Sep 22, 2011 at 09:21 PM

An alternative way to scale GUI elements automatically is to add this snippet of code to the top of all of your OnGUI() functions, and then create your boxes in native resolution pixel numbers. The GUI.matrix setup below will scale everything to look the same on all machines

 var native_width : float = 1920;
 var native_height : float = 1080;
 
 function OnGUI ()
 {
     //set up scaling
     var rx : float = Screen.width / native_width;
     var ry : float = Screen.height / native_height;
     GUI.matrix = Matrix4x4.TRS (Vector3(0, 0, 0), Quaternion.identity, Vector3 (rx, ry, 1)); 
 
     //now create your GUI normally, as if you were in your native resolution
     //The GUI.matrix will scale everything automatically.

     //example
     GUI.Box(  Rect(810, 490, 300, 100)  , "Hello World!");
 
 }

Normally I'm against handing out free code like this, but GUI.matrix is complex {think 200-level college Math course complex} and it took me about 15 minutes of searching to find.

Add comment · Show 10 · Share

ThumbStorm · Sep 23, 2011 at 02:00 PM 0

Share

I'm speechless! Thanks for that little nugget. Last week I spent the better half of the morning making my own code that did something similar but was way more complex. Thanks again.

BigTuna89 · Mar 29, 2012 at 10:54 PM 0

Share

Im usually against copying and pasting code, but I think this is one of the exceptions for me. Hopefully I will be able to understand the GUI matrix function, but for now I appreciate it! Game doesnt work without this :)

Binxalot · Apr 10, 2013 at 05:47 PM 0

Share

This answer should be in the official documentation. Thank you sir, thank you.

javanoob · May 12, 2013 at 12:19 PM 0

Share

SilverTabby ,if I can fit this in my code your a genius, Scratch that even If I dont have a clue how to fir this in my code your still a genius :)

javanoob · May 14, 2013 at 05:07 PM 0

Share

So I guess you write all code to fit a 1920 by 1080 screen and this adjusts automatically for other resolutions,(shrinks gui boxes etc) ?

Show more comments

Answer 2

Answer by jahroy · Sep 22, 2011 at 07:57 PM

I wrote the GUI scaling code for our app the first day I used Unity.

We base our entire GUI on the height of the window.

We check the window height at the beginning of OnGUI. That value is compared to the optimized height (768) to determine the scale ratio.

From that point on the resulting ratio is applied to the position and size of the rectangles of all GUI elements.

I'll admit that I probably didn't do it the most efficient way possible, but we've never had to revisit the scaling code since day 1 and our app looks the same on all resolutions.

We even scale our fonts for standalone and web builds.

Add comment · Show 3 · Share

bpears · Jan 21, 2013 at 07:04 PM 0

Share

How do you do this? Can you please through down some sample code. I am doing something very similar using custom GUI skin style, I have got the GUIbutton background texture to scale perfectly, but the text/font of the style does not scale.

javanoob · May 12, 2013 at 12:19 PM 0

Share

changed ,well spotted :)

dylan92 · Jul 11, 2013 at 07:09 PM 0

Share

Try GUI Essentials if you need something that takes care of different resolutions and aspect ratios for GUITextures and GUIText.

Bulletproof way to do resolution independant GUI scaling?

2 Replies

Your answer

Welcome to Unity Answers

Follow this Question

Related Questions