Warning:
Even tho Unity 4.6 has come out with the new Unity GUI, you still need sometimes to use the old legacy GUI and GUILayout API specially if you are working with editor scripting.
Being said that, DONT use GUI/GUILayout functions for GUI on your projects (except editor scripting) if you are using Unity 4.6+; using GUI/GUILayout in your actual game is slow and consumes lots of draw calls!.
So now that everything is clear here’s a little bit o what happened:
I am programming a new tool for the asset store and I was needing to display some textures in the inspector view (after all the GUI was written using GUILayout…), but Unfortunately “EditorGUI.DrawPreviewTexture()” doesnt have a layouted version :/ and I didnt wanted to do the whole same thing again using plain GUI. so I came up with an interesting idea that I wanted to share on making GUI and GUILayout coexist in the same GUI :).
So I’m going to expose having GUILayout code and inserting GUI code. and making them both coexist in the same Repaint().
Mixing GUILayout with GUI
this happens when we have lots of GUILayout calls same as when we are building our window with pure GUILayout calls and there are some functions that are available only for GUI.
In my case I was wanting to create a tool for displaying the materials’ textures of any given object and some small info:
So the tool is organized and also looks like this:
and it even maintains its proportions! 😀
So how do I do it?, its actually pretty simple, basically what I create is an area (with GUILayout) and inside the area I create a ScrollView (also with GUILayout) and then in the inside we put all our GUI (relative to the Area we created and not to the window) and we fill everything with GUILayout.Spaces(px)!
Sounds complex? its not at all!, trust me :), let me show you a really simple code:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
Vector2 scrollPos = Vector2.zero; void OnGUI() { // some GUILayout code... // ... // Here's where we start to mix GUILayout with GUI. // create a rect where the GUI will be drawn Rect GUIRect = new Rect(3, 65, window.position.width-6, window.position.height-40-65); GUILayout.BeginArea(GUIRect); scrollPos = GUILayout.BeginScrollView(scrollPos, GUILayout.Width(window.position.width - 6), GUILayout.Height(window.position.height-40-55)); DrawGUI();//here we draw our GUI code GUI.EndScrollView(); GUILayout.EndArea(); } void DrawGUI() { //this is for start counting "Spaces" for GUILayout so we can expand/reduce //the scroll view vertically GUILayout.BeginVertical(); GUI.Label(new Rect(10, 0, 200 , 25), "This is sample label"); //lets create the space for the created GUI.Label(rect, str) GUILayout.Space(40);//40 = 10 + 25 + (5 (offset between labels)) GUI.Label(new Rect(40, 0, 200 , 25), "another sample label"); GUILayout.Space(40); GUI.Label(new Rect(80, 0, 200 , 25), "3rd sample label"); GUILayout.Space(40); GUILayout.EndVertical(); } |
Basically what we need to do is to create an empty area from the GUILayout space and fill it with “spaces” that are consistent with what we draw on the GUI space. Let me draw it for you:
Mixing GUI with GUILayout.
Mixing GUI with GUILayout is basically the same process you just have to take into account the space consumed by the GUILayout and then just offset the other GUI objects so they can coexist.
I’ll leave this part to the reader tho.
Like this post?, feel free to subscribe to my posts, I’ll keep you posted on anything that I write :).
Any comments/suggestions/feedback let me know :).