ComboBox GUI
An Inspector & InGame Combo Box Element
Tutorial

wHiteRabbiT-sTudio

ComboBox asset store | unity forum

Introduction

This tutorial shows how to create a simple ComboBox GUI element in an inspector window and in the game view. The ComboBox acts like any of common GUILayout element and works with only two method calls. One for the textfield and the button, one for the dropdown overlay. The only tricks to know is about placing correctly this second call for the overlay in the script.

Quick Guide

First of all, in order to use this class, you should know where it is located in the wHiteRabbiT framework, i.e. its namespace :

1
using wHiteRabbiT.Unity.UI;

FYI, there are some other classes in the package such as AboutEW, feel free to explore them, some helpers which could be usefull.

The two methods are static so they can be called in the easiest way possible. Their syntax are explained below.
 

1
public static string BeginLayout(int id, List<string> list, params GUILayoutOption[] options)

Shows a ComboBox layout. Only draws the textfield and the dropdown button. You have to call the EndOverlay() method to draw the dropdown popup.
Returns : The content of the textfield.
id : Unique identifier.
list : List of string to populate the dropdown popup.

options An optional list of layout options that specify extra layouting properties.
 

1
public static void EndOverlay()

Draws the overlay popup dropdown.

Like any other GUI script, you have to call those methods in a OnGUI() block.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
public void OnGUI()
{
    // TODO : Put the GUI that would be on top of the ComboBox here
     
    string TextFieldValue = GUIComboBox.BeginLayout(0, NameList);
    //GUIComboBox.BeginLayout(1, NameList);
    //GUIComboBox.BeginLayout(2, NameList);
    //[...]
     
    // TODO : Put the GUI that would be underneath the ComboBox and under the ComboBox's dropdown here
     
    GUIComboBox.EndOverlay(); // One call for all of the above
     
    // TODO : Put the GUI underneath the ComboBox BUT over the ComboBox's dropdown
}

As stated above, this GUI element may be used for both inspector view and game view.