HomeWeb Components API Reference - v0.17.0
    Preparing search index...

    Class ElementComponentElement

    The ElementComponentElement interface provides properties and methods for manipulating <pc-element> elements. The ElementComponentElement interface also inherits the properties and methods of the HTMLElement interface.

    Despite the name, this is not a base class or a generic wrapper: it is the engine's 2D UI component, which gives its host entity a rectangle in a <pc-screen> hierarchy that draws either an image, a line of text or nothing (type="image", "text" or "group"). The tag spells the engine component it adds, as every component element does.

    Engine component: ElementComponent (element).

    Hierarchy (View Summary)

    Index
    anchor autoFitHeight autoFitWidth autoHeight autoWidth closestApp closestEntity color component enabled enableMarkup fontAsset fontSize height lineHeight margin mask maxFontSize minFontSize opacity pivot pixelsPerUnit spriteAsset spriteFrame text textureAsset type useInput width wrapLines
    _onReady _resetReady getInitialComponentData initComponent ready
    • get autoFitHeight(): boolean

      Gets whether a text element automatically reduces its font size to fit its height.

      Returns boolean

      Whether the height is auto-fit.

    • set autoFitHeight(value: boolean): void

      Sets whether a text element should automatically reduce its font size (down to min-font-size) so the text fits within the element's height. Requires auto-height to be false.

      Parameters

      • value: boolean

        Whether to auto-fit the height.

      Returns void

    • get autoFitWidth(): boolean

      Gets whether a text element automatically reduces its font size to fit its width.

      Returns boolean

      Whether the width is auto-fit.

    • set autoFitWidth(value: boolean): void

      Sets whether a text element should automatically reduce its font size (down to min-font-size) so the text fits within the element's width. Requires auto-width to be false.

      Parameters

      • value: boolean

        Whether to auto-fit the width.

      Returns void

    • get autoHeight(): boolean

      Gets whether the element component should automatically adjust its height.

      Returns boolean

      Whether to automatically adjust the height.

    • set autoHeight(value: boolean): void

      Sets whether the element component should automatically adjust its height to the text content (text elements only).

      Parameters

      • value: boolean

        Whether to automatically adjust the height.

      Returns void

    • get autoWidth(): boolean

      Gets whether the element component should automatically adjust its width.

      Returns boolean

      Whether to automatically adjust the width.

    • set autoWidth(value: boolean): void

      Sets whether the element component should automatically adjust its width to the text content (text elements only).

      Parameters

      • value: boolean

        Whether to automatically adjust the width.

      Returns void

    • get closestApp(): AppElement | null

      The nearest ancestor <pc-app> element, or null if this element has no <pc-app> ancestor. The search starts at the parent, so an element never resolves to itself.

      Returns AppElement | null

      The closest app element, or null.

    • get closestEntity(): EntityBaseElement | null

      The nearest ancestor element that fronts an entity — <pc-entity>, <pc-model> or <pc-node> — or null if this element has no such ancestor. The search starts at the parent, so an element never resolves to itself.

      Returns EntityBaseElement | null

      The closest entity-fronting element, or null.

    • get enabled(): boolean

      Gets the enabled state of the component.

      Returns boolean

      The enabled state of the component.

    • set enabled(value: boolean): void

      Sets the enabled state of the component.

      Parameters

      • value: boolean

        The enabled state of the component.

      Returns void

    • get mask(): boolean

      Gets whether the element component is a mask.

      Returns boolean

      Whether the element is a mask.

    • set mask(value: boolean): void

      Sets whether the element component is a mask, clipping its descendants to its bounds (image elements only).

      Parameters

      • value: boolean

        Whether the element is a mask.

      Returns void

    • get maxFontSize(): number

      Gets the largest font size a text element may use when auto-fitting.

      Returns number

      The maximum font size.

    • set maxFontSize(value: number): void

      Sets the largest font size a text element may use when auto-fitting.

      Parameters

      • value: number

        The maximum font size.

      Returns void

    • get minFontSize(): number

      Gets the smallest font size a text element may use when auto-fitting.

      Returns number

      The minimum font size.

    • set minFontSize(value: number): void

      Sets the smallest font size a text element may use when auto-fitting.

      Parameters

      • value: number

        The minimum font size.

      Returns void

    • get pixelsPerUnit(): number | null

      Gets the number of pixels per unit used when rendering a sprite.

      Returns number | null

      The pixels per unit.

    • set pixelsPerUnit(value: number | null): void

      Sets the number of pixels per unit to use when rendering a sprite (image elements only).

      Parameters

      • value: number | null

        The pixels per unit.

      Returns void

    text

    • get useInput(): boolean

      Gets whether the element component accepts input events.

      Returns boolean

      Whether the element accepts input.

    • set useInput(value: boolean): void

      Sets whether the element component accepts input events (required for buttons and scrolling).

      Parameters

      • value: boolean

        Whether the element accepts input.

      Returns void

    Protected_onReady

    • _onReady(): void

      Called when the element is fully initialized and ready. Subclasses should call this when they're ready. Resolves the ready promise and dispatches a bubbling, composed ready event. Signals at most once per readiness cycle: a repeat call before _resetReady has re-armed the promise does nothing.

      Returns void

    Protected_resetReady

    • _resetReady(): void

      Returns the ready promise to its pending state. Subclasses should call this when the resource their readiness announced is torn down (typically from disconnectedCallback), so that a later re-initialization can signal readiness again. Does nothing while the promise is still pending — an in-flight waiter carries over to the next readiness cycle rather than being stranded on a promise nothing will ever resolve.

      Returns void

    • Returns a promise that resolves with this element when it's ready. This is the low-level primitive underlying whenReady, which is the recommended way to wait for elements.

      Readiness tracks the element's current lifecycle: once a ready element is torn down (for example by removing it from the document), this returns a fresh promise that resolves when the element is next ready. A promise obtained earlier stays resolved — call this again after re-inserting an element rather than reusing a promise from before its removal.

      Returns Promise<ElementComponentElement>

      A promise that resolves with this element when it's ready.

    Settings
    Member Visibility

    On This Page
    Accessors
    Methods