← All namespaces

widget

UI & widgets Core

Author UMG Widget Blueprints: the widget tree, styles, event bindings, and animations. One of the most complete areas.

What it’s for

This area edits UMG Widget Blueprints as assets: the widget tree (panels, buttons, text, images), the properties and slot layout on each widget, the event bindings on the generated class, and the timeline animations stored in the asset. It is how your assistant builds and reshapes your game’s UI from plain-language requests, without you clicking through the UMG Designer.

Use it to create a new Widget Blueprint, add or rearrange widgets, restyle text and brushes, wire a button click to a handler, or author a fade or slide animation. The richest reads and writes go through XML: widget.export_xml dumps the whole tree as readable, diffable markup, and widget.import_xml builds or replaces a tree in a single call, which is faster and easier to review than a chain of per-widget edits.

This is the asset-side counterpart to the ui namespace. Reach for widget when you are authoring a stored Widget Blueprint; reach for ui when you want to poke at a widget that is already instantiated on screen at runtime. Creating an event binding is a two-step job: emit the binding node with blueprint.compile_bpir, then confirm it with widget.bind_event, which only verifies an existing binding.

Examples

Build a new HUD widget from markup

Create the asset, then hand the whole tree over as one XML string instead of adding widgets one at a time.

You: Make a new WBP_HUD under /Game/UI with a health bar and a score label.

  call("widget.create_widget_blueprint", {name:"WBP_HUD", folder:"/Game/UI"})
    → {ok:true, widgetPath:"/Game/UI/WBP_HUD"}
  call("widget.import_xml", {widgetPath:"/Game/UI/WBP_HUD",
        xml:"<CanvasPanel><ProgressBar name='Health'/><TextBlock name='Score'/></CanvasPanel>"})
    → {ok:true, variablesCreated:["Health","Score"], requiresCompile:true}

Done. WBP_HUD created with a Health bar and Score label; recompiled.

Read a widget, then restyle it

Export the current tree as XML to see what is really there, then set properties on one named widget.

You: In WBP_PauseMenu, make the Resume label green and bump its font size.

  call("widget.export_xml", {widgetPath:"/Game/UI/WBP_PauseMenu"})
    → "<Button name='Resume'><TextBlock name='ResumeLabel'/></Button>"
  call("widget.set", {widgetPath:"/Game/UI/WBP_PauseMenu", widgetName:"ResumeLabel",
        properties:{ColorAndOpacity:{SpecifiedColor:{R:0.25,G:0.72,B:0.33,A:1.0}}, Font:{Size:28}}})
    → {ok:true}

Done. Resume label recolored green at font size 28.

Author a fade-in animation

Create the animation, bind it to a widget’s opacity, then key two frames so it fades from 0 to 1.

You: Add a half-second fade-in for the Score label in WBP_HUD.

  call("widget.create_widget_animation", {widgetPath:"/Game/UI/WBP_HUD",
        animationName:"ScoreFadeIn", duration:0.5})
    → {ok:true}
  call("widget.add_animation_track", {widgetPath:"/Game/UI/WBP_HUD",
        animationName:"ScoreFadeIn", widgetName:"Score", propertyName:"RenderOpacity"})
    → {ok:true}
  call("widget.add_animation_keyframe", {widgetPath:"/Game/UI/WBP_HUD",
        animationName:"ScoreFadeIn", widgetName:"Score", time:0.0, value:0.0})
    → {ok:true}
  call("widget.add_animation_keyframe", {widgetPath:"/Game/UI/WBP_HUD",
        animationName:"ScoreFadeIn", widgetName:"Score", time:0.5, value:1.0})
    → {ok:true}

Done. ScoreFadeIn fades the Score label from 0 to 1 over 0.5s.

← Back to all namespaces