ComboBox

Create a drop-down box

There are two ways to create a drop-down box component.

Edit-mode properties

In the component editing state, the properties panel of the drop-down box component is:

Instructions

Select a drop-down box component on the stage, and the property panel list on the right appears:

GComboBox

We can edit the items in the drop-down list in the editor, or set them dynamically with code, for example:

GComboBox combo = gcom.GetChild ("n1").asComboBox;
    // items is an array of list item titles.
    combo.items = new string [] {"Item 1", "Item 2", ...};
    // values is optional and represents the value of each list item.
    combo.values = new string [] {"value1", "value2", ...};
    // Get the index of the currently selected item
    Debug.Log (combo.selectedIndex);
    // Get the value of the currently selected item.
    Debug.Log (combo.value);
    // Set the selected item by index
    combo.selectedIndex = 1;
    // Set the selected item by value
    combo.value = "value1";

There is a notification event when the drop-down box selection is changed:

//Unity/Cry/MonoGame
combo.onChanged.Add(onChanged);
//AS3
combo.addEventListener(StateChangeEvent.CHANGED, onChanged);
//Egret
combo.addEventListener(fairygui.StateChangeEvent.CHANGED, this.onChanged, this);
//Laya
combo.on(fairygui.Events.STATE_CHANGED, this, this.onChanged);
//Cocos2dx
combo->addEventListener(UIEventType::Changed, CC_CALLBACK_1(AClass::onChanged, this));
//CocosCreator
combo.on(fgui.Event.STATUS_CHANGED, this.onChanged, this);

The pop-up box will automatically close when you click on the blank space. If you want to be notified of this shutdown, you can listen to the event of moving out of the stage, for example:

//Unity/Cry
combo.dropdown.onRemoveFromStage.Add(onPopupClosed);
//AS3
combo.dropdown.addEventListener(Event.REMOVED_FROM_STAGE, onPopupClosed);
//Egret
combo.dropdown.addEventListener(egret.Event.REMOVED_FROM_STAGE, this.onPopupClosed, this);
//Laya
combo.dropdown.on(laya.events.Event.UNDISPLAY, this, this.onPopupClosed);
//Cocos2dx
combo->getDropdown()->addEventListener(UIEventType::Exit, CC_CALLBACK_1(AClass::onPopupClosed, this));
//CocosCreator
combo.on(fgui.Event.UNDISPLAY, this.onPopupClosed, this);

If you want to close the popup box manually:

GRoot.inst.HidePopup ();