UI Editor/Components

Components represent the various bits of UI that appear on windows (labels, buttons, menus, etc). They also have scripting interfaces for modifying them from JavaScript.

When selecting a Component or Window in the Hierarchy panel, its relevant properties are displayed in the Inspector tab.

Creating Components

Adding new components to the UI is a simple workflow:

1. Find the window or component you would like as the parent for the new component in the Hierarchy panel
2. Right click the desired parent and expand the "Add" sub-menu
3. Select the type of component from the sub-menu list
4. The new component will be automatically selected when created

Basic Components

Label

A label represents a static piece of text on the screen. Labels can be used by themselves or as a sub-component of more complex components like buttons.

Imagebox

An image box provides a static image to display as part of a window. This is often used for icons, legend/key images, and non-interactive stylistic elements.

User Interaction Components

Button

Buttons are one of the most ubiquitous UI components, providing click-handling functionality, a label, and optionally an icon.

Slider

Horizontal or vertical slider for adjusting a value between a minimum and a maximum.

Toggle

Checkbox or radio button type control. Has on/off state and can be part of a group to ensure only one of them is active at a time.

Text Input Components

Textfield

Single-line text entry field for getting user input (names, numeric values, etc.)

Textarea

Multi-line text entry field for getting longer user input (comments, feedback, etc.)

Searchfield

Single-line text entry field for user input that behaves more like a typical search field on a web page (clear button, etc)

Layout Components

Panel

A panel provides a simple way of grouping and laying out other components.

Grid

A panel which can arrange things in a consistent grid pattern (like Windows Explorer)

Collapsible Panel

A panel with a header that can be collapsed and reopened. Best used inside a larger panel with Vertical layout turned on

Scrollbox

A panel with scrollbars and an internal surface for arranging items that you can then scroll through.

Dropdown Components

Combobox

Dropdown allowing the user to select from a list of input values.

Menu

Dropdown allowing the user to select from multiple actions, with support for submenus.

Other Components

Tree

Trees are a special type of Scrollbox with features for displaying a hierarchy of collapsible nodes.

Webview

Provides a surface for displaying a webpage, useful for TOS or other online content.