@relu-interactives/spatial-ecs
@relu-interactives/spatial-ecs / components / UIPanelComponent
Class: UIPanelComponent ​
Defined in: components/UIPanel.ts:33
A flat UI surface in the world — the backdrop menus and HUDs are built on.
Size is authored in METRES on the component, never via transform scale: the canvas texture is rasterised for the authored size, so scaling the entity would stretch texels into blur. Child widgets (text, buttons, toggles, sliders) are ordinary entities parented under the panel and placed with their transforms.
follow: "billboard" yaw-faces the camera each frame; for a wrist menu, parent the panel under an XR Interactor's Left/Right slot entity instead.
Extends ​
Constructors ​
Constructor ​
ts
new UIPanelComponent(options?): UIPanelComponent;Defined in: components/UIPanel.ts:50
Parameters ​
| Parameter | Type |
|---|---|
options? | UIPanelOptions |
Returns ​
UIPanelComponent
Overrides ​
Properties ​
| Property | Type | Description | Defined in |
|---|---|---|---|
width | number | Full width in metres. | components/UIPanel.ts:35 |
height | number | Full height in metres. | components/UIPanel.ts:37 |
backgroundColor | string | - | components/UIPanel.ts:38 |
backgroundOpacity | number | 0–1. Panels are usually slightly translucent in XR. | components/UIPanel.ts:40 |
cornerRadius | number | Corner radius in metres. | components/UIPanel.ts:42 |
borderWidth | number | Border thickness in metres; 0 disables the border. | components/UIPanel.ts:44 |
borderColor | string | - | components/UIPanel.ts:45 |
pixelDensity | number | Texture density in px/metre, clamped 256–2048 at render time. | components/UIPanel.ts:47 |
follow | UiFollowMode | - | components/UIPanel.ts:48 |