Dynamic GUI Columns in GUI Area? (C#)

I’m having a big issue with my GUI. The basic style I’m using is:

GUILayout.BeginArea();
GUILayout.FlexibleSpace();
if(GUILayout.Button){}
if(GUILayout.Button){}
if(GUILayout.Button){}
if(GUILayout.Button){}
GUILayout.FlexibleSpace();
GUILayout.EndArea();

Each time a button is clicked, it is eliminated from the menu. In the end, only one button will remain. It works perfectly if the buttons are listed vertically in one column, but I want the buttons to be larger and in two columns.

My buttons have a pre-set width and height. My GUI Area has a width of 800, my buttons each have a width of 300. How can I make them take up the full space of the GUI Area?

TL;DR: A GUILayout area has buttons that disappear. How can these buttons be divided into columns?

You’ll want to look at GUILayout.BeginHorizontal() and GUILayout.BeginVertical()

Begin Vertical creates rows, beginHorizontal creates columns.

Your final script will probably look like this :

GUILayout.BeginArea();
GUILayout.BeginHorizontal(); //side by side columns

GUILayout.BeginVertical(); //Layout objects vertically in each column
... button 1 ...
... button 2 ...
GUILayout.EndVertical();

GUILayout.BeginVertical();
... button 3 ...
... button 4 ...
GUILayout.EndVertical();


GUILayout.EndHorizontal();
GUILayout.EndArea();

This will create a layout like this:

| button1 | button3 |

| button2 | button4 |