ParagonVisualElementDrawer

Abstract base class for property drawers that use UI Toolkit for rendering instead of pure IMGUI. Extends ParagonDrawer<TProperty> and bridges the Odin Inspector IMGUI pipeline to a UI Toolkit VisualElement tree via OdinImGuiElement. Contains a private nested ParagonPropertyElement that delegates its OnCreateGUI() back to the drawer.

Definition

Namespace: Paragon.Editor Assembly: Paragon.Editor.dll

public abstract class ParagonVisualElementDrawer<TProperty> : ParagonDrawer<TProperty>

Inheritance: OdinValueDrawer<TProperty> → ParagonDrawer<TProperty> → ParagonVisualElementDrawer<TProperty>

Remarks

This drawer works by embedding a UI Toolkit VisualElement tree inside Odin's IMGUI rendering pipeline:

1. Initialize() — Creates a ParagonPropertyElement (a private ParagonVisualElement subclass) that wraps the drawer. Adds an IMGUIContainer for OnInspectorGUI(). Wraps everything in an OdinImGuiElement for Odin IMGUI compatibility.

2. DrawPropertyLayout() (sealed) — Null-checks the property value, then calls ImguiElementUtils.EmbedVisualElementAndDrawItHere() to render the UI Toolkit tree inside the IMGUI context.

3. ParagonPropertyElement.OnCreateGUI() — Delegates to the drawer's OnCreateGUI(), which is where subclasses build their visual tree.

4. ParagonPropertyElement.GetTemplateAsset() — Reads the [UxmlTemplate] attribute from the drawer class (not the element class), allowing drawers to bind UXML templates.

Quick Lookup

Goal	How
Build UI	Override OnCreateGUI() — add elements via Add(child)
Add IMGUI content	Override OnInspectorGUI()
Query elements	Q("name") or Q<Button>("name")
Bind a UXML template	Add [UxmlTemplate("Name")] to the drawer class
Access property value	Use target (inherited from ParagonDrawer<T>)
Control drawer priority	Add [DrawerPriority(DrawerPriorityLevel.SuperPriority)]

Properties

Property	Type	Access	Description
name	string	public	The root element's name (set to typeof(TProperty).Name)
propertyElement	VisualElement	protected	The inner ParagonPropertyElement — add children here via Add()

Methods

OnCreateGUI

Abstract callback to build the visual tree. Called by the inner ParagonPropertyElement during its creation lifecycle. Use Add() and Q() to construct and query the UI.

protected abstract void OnCreateGUI()

OnInspectorGUI

Virtual callback for per-frame IMGUI content rendered inside the embedded IMGUIContainer.

protected virtual void OnInspectorGUI()

DrawPropertyLayout

Sealed. Null-checks ValueEntry.SmartValue and embeds the UI Toolkit element via Odin's IMGUI bridge. Cannot be overridden.

protected sealed override void DrawPropertyLayout(GUIContent label)

Add

Adds a child element to the propertyElement.

protected void Add(VisualElement child)

Q

Queries the propertyElement for children by name.

protected VisualElement Q(string name = null)
protected TElement Q<TElement>(string name = null) where TElement : VisualElement

Extension Points

Required Overrides

Method	Purpose
OnCreateGUI()	Build the visual tree — add elements, query template children

Optional Overrides

Method	Purpose
OnInspectorGUI()	Per-frame IMGUI content alongside the visual tree

Implementation Requirements

When subclassing, you MUST:

1. Override OnCreateGUI() — this is abstract

2. Use Add() to add children (adds to propertyElement, not root)

3. Use Q() to query children (queries propertyElement, not root)

You SHOULD:

• Add [DrawerPriority(DrawerPriorityLevel.SuperPriority)] to ensure priority over default drawers

• Add [UxmlTemplate("TemplateName")] to bind a UXML template (template is resolved from the drawer class, not the property element)

You MUST NOT:

• Override DrawPropertyLayout() — it is sealed

• Add children directly to rootVisualElement — use Add() which targets propertyElement

Operators

Operator	Description
implicit operator VisualElement	Converts the drawer to its root VisualElement

Common Pitfalls

Null values are silently skipped. DrawPropertyLayout() returns early if ValueEntry.SmartValue == null. Your OnCreateGUI() and OnInspectorGUI() will never be called for null property values. This means no "create" or "assign" UI is shown by default.

Add() and Q() target propertyElement, not the root. The drawer's element hierarchy is rootVisualElement → propertyElement → your children + IMGUIContainer. Direct rootVisualElement access is not exposed to subclasses.

UXML template resolves from the drawer class. The inner ParagonPropertyElement overrides GetTemplateAsset() to look for [UxmlTemplate] on the drawer class (e.g., ParagonSubsystemDrawer), not on ParagonPropertyElement itself.

Examples

UI Toolkit Property Drawer with Template

[DrawerPriority(DrawerPriorityLevel.SuperPriority)]
[UxmlTemplate("MyPropertyElement")]
public class MyPropertyDrawer : ParagonVisualElementDrawer<MyProperty>
{
    private Toolbox toolbox;
    private Button addButton;
    private VisualElement container;

    protected override void OnCreateGUI()
    {
        toolbox = Q<Toolbox>();
        addButton = new Button(OnAddClicked) { text = "Add" };
        container = new VisualElement { name = "Container" };

        Add(addButton);
        Add(container);
    }

    protected override void OnInspectorGUI()
    {
        // Per-frame updates
        if (target.IsDirty)
        {
            RebuildContainer();
        }
    }

    private void OnAddClicked() { /* ... */ }
    private void RebuildContainer() { /* ... */ }
}

Minimal Programmatic Drawer

[DrawerPriority(DrawerPriorityLevel.SuperPriority)]
public class SimpleDrawer : ParagonVisualElementDrawer<SimpleData>
{
    protected override void OnCreateGUI()
    {
        var label = new Label(target.Name);
        var field = new FloatField("Value") { value = target.Value };
        field.RegisterValueChangedCallback(evt => target.Value = evt.newValue);

        Add(label);
        Add(field);
    }
}

See Also

• ParagonDrawer<TProperty> — IMGUI-only base drawer (parent class)

• ParagonVisualElement — base visual element (used internally as ParagonPropertyElement)

• ParagonEditor — base editor with similar UXML + IMGUI pattern

• Objects — editor objects overview