LUI Documentation - Refs and Direct Element Access

Refs and Direct Element Access

LuiRef provides geometry and direct UI Toolkit element access.


private readonly LuiRef _panel = new();
 
public override LuiNode Render()
{
    return Lui.Div("p-4 bg-slate-900").Ref(_panel);
}

Subscribe after mount:


protected internal override void OnLuiMount()
{
    _panel.GeometryChanged += OnPanelGeometryChanged;
}
 
protected internal override void OnLuiUnmount()
{
    _panel.GeometryChanged -= OnPanelGeometryChanged;
}

Use direct setters for very frequent updates:


private readonly LuiRef _fill = new();
 
void Update()
{
    _fill.SetWidthPercent(_healthPercent * 100f);
}

Available helpers include:

SetWidthPercent
SetWidthPx
SetHeightPercent
SetHeightPx
SetOpacity
SetVisible
SetTranslate
SetScale
SetRotate
SetBackgroundColor
SetColor

Direct element access is an escape hatch:


_fill.Element.style.width = Length.Percent(50f);

These changes bypass render/diff and can be overwritten by a later managed style reapply.