Click or drag to resize

UI Editor

Material EditorManual / Content Creation / UI EditorFlow Graph Editor

UI Editor

Contents
Overview

UI editor is designed for configuring user interface elements of a project. Editor could be used to create windows, forms, HUD screens, and UI controls.

Screenshot999999454.png
Creating UI controls

New UI control can be created as a separate resource or inside existing object. Read more about creating resources.

Screenshot999999455.png

When creating a resource, one should select the control that will be root. For example, it could be Window or empty Control. After creation a canvas for editing will appear.

Screenshot999999456.png
Editing UI controls

UI editor works in the same way as any other NeoAxis editors. Simplest way to create a control is to drag & drop those from Resources Window.

Screenshot999999457 2.png

Nested controls can be created in the same way.

Screenshot999999458.png

Controls can be selected via mouse, it's settings can be adjusted in the Settings Window.

Screenshot999999460.png
UI Style

Control's appearance could be customized with UI Style object. Style can be applied both to a separate control and to a whole hierarchy.

In order to set a style, one should select control and Reference button of Style property.

Screenshot999999461 2.png

Select desired style in appeared window. Engine has Simple.uistyle, as an example, which can be found at Assets\Base\UI\Styles.

Screenshot999999462.png

Final result:

Screenshot999999463.png
UI control as a head-up display

Scene supports attachment of UI control as a head-up display (HUD).

To do so, one should open a scene, select scene object, and set UI Screen property. An example can be found in the Assets\_Tests folder, _TestSceneUI.scene and _TestSceneUI_Screen.ui files.

Screenshot999999464 2.png

Result in the Player:

Screenshot999999465.png
See also
Material EditorFlow Graph Editor