GUI Within Editor / Pause Before OnGUI

I’m a relative noob, an artist, but with programing experience. I’ve searched all over and can’t seem to find anything about my main issue… that the GUI in-editor doesn’t look like my in-game (pressing the play button) GUI.

Basically, through all of my searching, etc., I’ve gotten my GUI’s background image to resize using the OnGUI and DrawTexture methods. My image size is FUll HD (1920x1080), and I’ve got the Game Window set to 16:9… so when I hit play it ends up being 1280x720. [so far so good]

The problem is that in the Game Window, the only way I’ve found to resize is to indicate so in the GUITexture’s width/height and pixel inset x/y. However, this I’m assuming this is NOT the ideal way, since I will eventually have draggable GUI elements (think 2D puzzle game), and I can’t see having to do that for all elements. Oh, I should point out that the adjusting the GUITexture’s w/h x/y is completely depentant on the size of my game window in pixels, which means that when I go from monitor to monitor (with different resolutions), the Game Window is screwed up in the editor.

I think that a possible answer is to set the GUITexture’s w/h dynamically based on the screen.width/height, but I can’t seem to figure out how to do it. The other possiblity (and probably better) would be to have ALL of my GUI elements in a container, and scale based on eidtor window size so that I can easily work with things without having to constantly jump in/out of the game.

Hope that all makes sense.

In addition, when I hit play, and the BG image resizes, there is a one-second pause before it does, which looks like garbage. Anyone know the problem here? Is it possible to not draw anything until it resizes?

Thanks in advance!

Hi, welcome to the forum!

It is certainly a good idea to base your GUI positioning on the values of Screen.width and Screen.height. Say, for example, if you wanted buttons down the right of the screen, you would set the X position to Screen.width minus the width of the button:-

var buttonWidth: int;
   ...

GUI.Button(new Rect(Screen.width - buttonWidth, yPos, buttonWidth, buttonHeight), "Click me");

…and similarly with Screen.height and the Y coordinate. If you want to centre a GUI element around a point on the screen, you need to subtract half the width and height from the point, etc.

As for the delay, is this happening in the built app or just in the editor? There is a slight delay when you start gameplay in the editor, but you shouldn’t normally see this in the finished product.

Thanks, andeee…

I definitely understand the math behind the positioning… I probably didn’t explain myself well enough. The short short version is that when resizing the Game Window area, my GUI would either gain a border (if window scaled bigger than my hardcoded texture width/height settings) or the texture would be “eaten away” (if window scaled smaller).

However, the resizing is now working (huge shout out to Ken for giving me the fix!) within the editor the way I need it thanks to a single line of code:

@script ExecuteInEditMode()

Just put it at the top of the script that’s controlling the OnGUI function, and it now updates within the editor. Awesome! (note: after a few tests of commenting it out and in again, for whatever reason, it won’t work if it has a semi-colon at the end and when it gets uncommented)

Be wary, however. I’m not sure how taxing that is on the system, but for now it’s up and running and I’ll finally be able to get to work on the GUI placement, etc.

As for the delay of resizing when hitting play… it appears to have been an editor-only issue as it doesn’t happen with a build. In addition, this popping problem also seems to be resolved with the above line of code.