RmlUi
RmlUi is a third-party GUI library that uses an HTML-like syntax to describe UI elements, and CSS to style them. RmlUi is lightweight, yet flexible.
Support for RmlUi is provided through a dedicated engine plugin. To enable it in your project, activate the plugin in the project settings.
Rml Documentation
The documentation for RmlUi can be found here.
Please refer to that documenation for any questions around how to use RmlUi.
Sample
The RTS Sample shows how to use RmlUi. Have a look at it the project in the editor, it contains Rml assets. The editor shows a live preview for Rml canvases, and you can edit the respective .rml files to see the effect:
The sample uses multiple RmlUi Canvas 2D components in its scene to place the UI elements. At runtime the RTS sample's game code accesses the RmlUi functionality through the ezRmlUiCanvas2DComponent. Search the sample's code for those places to see how to interact with the GUI.
Using ezRmlUiCanvas2DComponent::GetRmlContext() you get access to the ezRmlUiContext. This class implements Rml::Core::Context. This gives you access to all the RmlUi features. See the RmlUi documentation for details.
Canvas Components
ezEngine provides two canvas components for placing RmlUi documents in a scene:
- The RmlUI Canvas 2D Component (
ezRmlUiCanvas2DComponent) renders the UI as a screen-space overlay. This is the standard choice for HUDs and menus. - The RmlUI Canvas 3D Component (
ezRmlUiCanvas3DComponent) renders the UI into a texture applied to a mesh in the scene, allowing UI panels to exist as physical objects in the 3D world.
Both components support blackboard data binding, event messages, and on-demand rendering. See the individual component pages for their full property reference.
Localization
All text content in RmlUi documents is automatically passed through ezEngine's localization system (ezTranslate). That means you can set up translation tables for different languages.