- Home /
 
Make GUILayout horizontal first, then vertical? (C#)
By that I mean fill it's horizontal first, then it's vertical? I did a google search and found nothing, so I figured it would also be nice to be able to find it via google.
For instance I have this code, but it makes the items start filling vertically not horizontally.
     void OnGUI()
     {
         if(inventoryOpen)
         {
             int tempinv = 0;
             GUILayout.BeginArea (new Rect(40, 40, 500, 500));
             GUILayout.Box ("Weapons");
             foreach(GameObject items in inventory)
             {
             if(GUILayout.Button (  new GUIContent(items.GetComponent<Item>().itemname,  items.GetComponent<Item>().itemname + "\n" + items.GetComponent<Item>().currentWepType + "\n" + items.GetComponent<Item>().dmg + " dmg\n" + items.GetComponent<Item>().aspd + " seconds per attack"), GUILayout.Width (50), GUILayout.Height (50)))
                 {
                     Debug.Log ("Equipping " + items.name);
                     if(hasCloned)
                     {
                         Destroy (clone1);
                     }
                     tempinv++;
                     toUpdate = true;
                     hasCloned = true;
                     if(toUpdate)
                     {
                         clone1 = Instantiate(items, WepHolder.transform.position, WepHolder.transform.rotation) as GameObject;
                         clone1.transform.parent = GameObject.Find ("Main Camera").transform;
                         clone1.SetActive (true);
                         Debug.Log ("You are now using: " + items.name);
                         clone1.tag = "weaponEquipped";
                         toUpdate = false;
                     }
                     
                 }
 
             }
         if(GUI.tooltip != null)
             {
                 GUILayout.Box (new GUIContent(GUI.tooltip), GUILayout.Height(67));
                 GUI.tooltip = null;
             }
         GUILayout.EndArea ();
         }
 
              well, I figured out also that I don't have any max width or height, yikes!
Edit: I don't get it, isn't GUILayout supposed to autmatically make sure it doesn't go out of it's own bounds? it's not doing so.
Answer by Halleflux · Jul 22, 2013 at 09:23 PM
Are you looking for GUILayout.BeginHorizontal and GUILayout.BeginVertical?
You can nest these to provide the effect you desire.
 GUILayout.BeginHorizontal();
 GUILayout.BeginVertical();
 //stuff
 GUILayout.EndVertical();
 GUILayout.BeginVertical(); //Instead of hardcoding it, you can use a for()    loop to get multiple columns.
 //stuff
 GUILayout.EndVertical();
 GUILayout.EndHorizontal(); //Remember to end each one!
 
               Look here for more information.
Answer by Loius · Jul 22, 2013 at 09:23 PM
The trick is to build the bigger area first. So make a wide space with a Horizontal, and then make several Verticals inside it. The verticals will "stack" horizontally (since they're in a Horizontal). It's tricky to get used to but once you do it's pretty slick.
 GUILayout.BeginHorizontal(); {
   GUILayout.BeginVertical(GUILayout.ExpandWidth(true)); {
     GUILayout.Label("Stacked 1");
     GUILayout.Label("Stacked 2");
   } GUILayout.EndVertical();
   GUILayout.BeginVertical("box", GUILayout.Width(200)); {
     GUILayout.Label("Squished 1");
     GUILayout.Label("Squished 2");
   } GUILayout.EndVertical();
 } GUILayout.EndHorizontal();
 
               [1]: http://docs.unity3d.com/Documentation/ScriptReference/GUILayout.html
Yes, I looked at the docs. I just can't really understand the GUI docs at all for some reason. Normal coding? no big deal.
Don't forget to use EndVertical and EndHorizontal as well.
I tried this code, and when I put it in, it still went vertical only, no horizontal.
@Loius You forgot to add EndHorizontal and EndVertical :) 
I still haven't found one that seems to work the right way. I also can't figure out how to get it to after 6 or so, go onto another. I had that tempinv variable, and I had an if saying if(tempinv > 5) and then to make a new thingy, and put up a debug message, but it didn't even get to the debug.
Answer by Hybridizer · Sep 25, 2018 at 10:47 PM
@Dothackking Old question, but helped me answer itself. You use nested
andEditorGUILayout.BeginHorizontal();
functions, and a modulo (%) to set the number of columns. This example is for making a Texture2DArray, so it uses an integer to set the number of textures, and gives you a field of texture slots matching that integer:EditorGUILayout.BeginVertical();
    int arraySize = 2; //Starting size of 2 images, can be adjusted by GUI field
    int arraySizeCheck; //Prevents the array from updating every frame and emptying
        Texture2D[] inputTextures; //Texture slots will automatically appear, disappear, and stack to match arraySize
        int arrayFieldWidth //This doesn't need to be its own value, I just use 4, this just shows the sorting math
        
        void OnGUI () {
        
        arraySize = EditorGUILayout.IntField ("Number of textures:", Mathf.Clamp(arraySize, 1, 36));
                if (arraySizeCheck != arraySize) {
                    inputTextures = new Texture2D[arraySize];
                    arraySizeCheck = arraySize;
                }
        //Get the window width so the array fits no matter the size
        EditorGUILayout.BeginVertical (GUILayout.MaxWidth (position.width));
                for (int i = 0; i < arraySize; i++) {
                    if (i % arrayFieldWidth == 0)
                        EditorGUILayout.BeginHorizontal ();
                    inputTextures[i] = (Texture2D)EditorGUILayout.ObjectField ("Texture " + (i).ToString(), inputTextures[i], typeof(Texture2D), false);
                    if (i != 0 && i % arrayFieldWidth == (arrayFieldWidth-1))
                        EditorGUILayout.EndHorizontal ();
                }
                EditorGUILayout.EndVertical ();
        
        }
 Hopefully this helps you or someone else out there! (P.S. this isn't a complete script, just the few values and OnGUI() function.) 
              Your answer