Skip to main content

Interface: WorldSpaceUiCanvasOptions

Defined in: ui/utilities/create-ui-canvas.ts:71

createUiCanvas options for renderMode: 'worldSpace' - a canvas whose root rect is an ordinary, anchored RectTransformEcsComponent positioned via the entity hierarchy, drawn through the caller's own camera.

Extends​

Properties​

anchor?​

optional anchor?: UiAnchorConfig

Defined in: ui/utilities/create-ui-canvas.ts:96

The anchor this canvas's own root rect resolves with. Defaults to UiAnchor.center() (a literal 100x100 reference-pixel box) - size it to fit the content you'll add as its children (a health bar background, say), and attach addUiWorldSpaceFollowComponent(world, canvas, { target: enemy }) so it tracks the entity it should follow. That's a different relationship from addParentComponent: a diegetic UI canvas almost always wants to follow its target's world position only, never its rotation (so it stays upright above the target regardless of which way it's facing, instead of swinging around with it) - see UiWorldSpaceFollowEcsComponent's own doc comment for why that isn't expressed as a ParentEcsComponent option. Register createUiWorldSpaceFollowEcsSystem() once, after createTransformEcsSystem(), for any world using this.

anchoredPosition?​

optional anchoredPosition?: Vector2

Defined in: ui/utilities/create-ui-canvas.ts:99

Offset of this canvas's own root rect from its anchor. See anchor above.

camera​

camera: number

Defined in: ui/utilities/create-ui-canvas.ts:79

The camera this canvas draws through - typically the game's own world camera, so this canvas pans, zooms, and moves with everything else it draws through.

cancelInput?​

optional cancelInput?: TriggerAction

Defined in: ui/components/canvas-component.ts:56

The action that clears this canvas's currently focused element, read by createUiNavigationEcsSystem. Register your own listener on cancelInput.triggerEvent (e.g. to close a menu) - the canvas itself only clears focus.

Inherited from​

CanvasInputOptions.cancelInput

optional navigateInput?: Axis2dAction

Defined in: ui/components/canvas-component.ts:64

The action that moves this canvas's focus between interactable elements, read by createUiNavigationEcsSystem. A step is taken on the tick the dominant axis first crosses navigationThreshold, not every tick the stick is held over.

Inherited from​

CanvasInputOptions.navigateInput

renderMode​

renderMode: "worldSpace"

Defined in: ui/utilities/create-ui-canvas.ts:72

submitInput?​

optional submitInput?: TriggerAction

Defined in: ui/components/canvas-component.ts:48

The action that raises onInvoke on the currently focused interactable

  • the gamepad/keyboard counterpart to a pointer click, read by createUiNavigationEcsSystem. Omit to leave this canvas's focused element only invocable by pointer.

Inherited from​

CanvasInputOptions.submitInput