Skip to content

Get Start ​

The UI Editor is a powerful built-in visual editor provided by ldlib. You can use it to easily design your UI, use it in your own mods, or use it through Java / KubeJS.

1. Get Start ​

How to open the UI Editor ​

In general, you can open it by command/ldlib ui_editor, which will use ./minecraft/ldlib/.. as its workspace.

image

Main Screen ​

image

  1. Menu: New/Save/Open UI projects. You can also import/export Resources here.
  2. Configurator: Basically all the setup happens here.
  3. Resources: available resources, e.g. color, texture, lang entries.

Create a new project ​

When you first use it, click it to create an empty UI project. (If you are making UI for MBD, select the MBD project)

image

No surprise, you'll see the follow case.

image

  1. ToolBox: Contains all the available UI widgets(components).
  2. Root Widget: The whole project has one and only one root widget, which is created by the system and you cannot delete it.

2. Basic ​

image

  1. red frame are selected widgets.
  2. blue frame is the widget that mouse is hovering over it.

Multi-Select ​

Press ctrl to multi-select / cancle-select widget.

Drag Selected Widgets ​

image

  1. Hold down alt + left-clicked, if you see the arrows (all directions) then you can drag it.
  2. Anyway, you could also modify position by a configurator.

Scale Selected Widgets ​

image

  1. Hold down alt + right-clicked, if you see the arrows (right bottom) then you can scale it.
  2. Anyway, you could also modify size by a configurator.

Add a Widget ​

All widgets (except the Root) need to be added to a father (parent) widget that accepts it, and we call such father (parent) widget as Group Type widget (e.g. Group, Tab Group, Scrollable Group).

image

  1. You can find all available widgets in the toolbox.
  2. Drag a widget into a Group Type widget.
  3. Rendering a green frame if such widget can accept it.

Move widget from one Groug to another Group ​

Sometimes you may want to modify the parent control.

  1. You can do this by the menu (right-clicking page) and cut/copy to the selected parent widget.
  2. A better way is to press the shiftand move it into the new Group.

image Rendering a green frame if such widget can accept it.

Adjust Children Widgets Order ​

In general, all the Group widgets have a children tab in its configurator, showing all children, you can adjust their order by dragging.

image

Right-click the page to open the menu.

image

  1. All operations will be performed on selected widgets.
  2. Basic operations
  3. Align: availabe when you select multi widgets.

Released under the MIT License.