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.

Hierarchy (View Summary)

ComponentElement
- ElementComponentElement

Accessors

anchor

get anchor(): Vec4
Gets the anchor of the element component.

Returns Vec4
The anchor.
- Defined in src/components/element-component.ts:170
set anchor(value: Vec4): void
Sets the anchor of the element component.
Parameters
- value: Vec4
  The anchor.
Returns void
- Defined in src/components/element-component.ts:159

asset

get asset(): string
Gets the id of the pc-asset to use for the font.

Returns string
The asset ID.
- Defined in src/components/element-component.ts:190
set asset(value: string): void
Sets the id of the pc-asset to use for the font (text elements).
Parameters
- value: string
  The asset ID.
Returns void
- Defined in src/components/element-component.ts:178

autoFitHeight

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.
- Defined in src/components/element-component.ts:615
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
- Defined in src/components/element-component.ts:604

autoFitWidth

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.
- Defined in src/components/element-component.ts:595
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
- Defined in src/components/element-component.ts:584

autoHeight

get autoHeight(): boolean
Gets whether the element component should automatically adjust its height.

Returns boolean
Whether to automatically adjust the height.
- Defined in src/components/element-component.ts:230
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
- Defined in src/components/element-component.ts:219

autoWidth

get autoWidth(): boolean
Gets whether the element component should automatically adjust its width.

Returns boolean
Whether to automatically adjust the width.
- Defined in src/components/element-component.ts:210
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
- Defined in src/components/element-component.ts:199

color

get color(): Color
Gets the color of the element component.

Returns Color
The color.
- Defined in src/components/element-component.ts:249
set color(value: Color): void
Sets the color of the element component.
Parameters
- value: Color
  The color.
Returns void
- Defined in src/components/element-component.ts:238

component

get component(): ElementComponent | null
Gets the underlying PlayCanvas element component.

Returns ElementComponent | null
The element component.
Overrides ComponentElement.component
- Defined in src/components/element-component.ts:151

enabled

get enabled(): boolean
Gets the enabled state of the component.

Returns boolean
The enabled state of the component.
Inherited from ComponentElement.enabled
- Defined in src/components/component.ts:80
set enabled(value: boolean): void
Sets the enabled state of the component.
Parameters
- value: boolean
  The enabled state of the component.
Returns void
Inherited from ComponentElement.enabled
- Defined in src/components/component.ts:69

enableMarkup

get enableMarkup(): boolean
Gets whether the element component should use markup.

Returns boolean
Whether markup is enabled.
- Defined in src/components/element-component.ts:268
set enableMarkup(value: boolean): void
Sets whether the element component should use markup.
Parameters
- value: boolean
  Whether to enable markup.
Returns void
- Defined in src/components/element-component.ts:257

get fontSize(): number
Gets the font size of the element component.

Returns number
The font size.
- Defined in src/components/element-component.ts:287
set fontSize(value: number): void
Sets the font size of the element component.
Parameters
- value: number
  The font size.
Returns void
- Defined in src/components/element-component.ts:276

height

get height(): number
Gets the height of the element component.

Returns number
The height.
- Defined in src/components/element-component.ts:306
set height(value: number): void
Sets the height of the element component.
Parameters
- value: number
  The height.
Returns void
- Defined in src/components/element-component.ts:295

lineHeight

get lineHeight(): number
Gets the line height of the element component.

Returns number
The line height.
- Defined in src/components/element-component.ts:325
set lineHeight(value: number): void
Sets the line height of the element component.
Parameters
- value: number
  The line height.
Returns void
- Defined in src/components/element-component.ts:314

margin

get margin(): Vec4 | null
Gets the margin of the element component.

Returns Vec4 | null
The margin.
- Defined in src/components/element-component.ts:344
set margin(value: Vec4 | null): void
Sets the margin of the element component (used to inset the element from stretched anchors).
Parameters
- value: Vec4 | null
  The margin as a Vec4 (left, bottom, right, top).
Returns void
- Defined in src/components/element-component.ts:333

mask

get mask(): boolean
Gets whether the element component is a mask.

Returns boolean
Whether the element is a mask.
- Defined in src/components/element-component.ts:364
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
- Defined in src/components/element-component.ts:353

maxFontSize

get maxFontSize(): number
Gets the largest font size a text element may use when auto-fitting.

Returns number
The maximum font size.
- Defined in src/components/element-component.ts:653
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
- Defined in src/components/element-component.ts:642

minFontSize

get minFontSize(): number
Gets the smallest font size a text element may use when auto-fitting.

Returns number
The minimum font size.
- Defined in src/components/element-component.ts:634
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
- Defined in src/components/element-component.ts:623

opacity

get opacity(): number
Gets the opacity of the element component.

Returns number
The opacity.
- Defined in src/components/element-component.ts:383
set opacity(value: number): void
Sets the opacity of the element component.
Parameters
- value: number
  The opacity (0 to 1).
Returns void
- Defined in src/components/element-component.ts:372

pivot

get pivot(): Vec2
Gets the pivot of the element component.

Returns Vec2
The pivot.
- Defined in src/components/element-component.ts:402
set pivot(value: Vec2): void
Sets the pivot of the element component.
Parameters
- value: Vec2
  The pivot.
Returns void
- Defined in src/components/element-component.ts:391

pixelsPerUnit

get pixelsPerUnit(): number | null
Gets the number of pixels per unit used when rendering a sprite.

Returns number | null
The pixels per unit.
- Defined in src/components/element-component.ts:421
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
- Defined in src/components/element-component.ts:410

spriteAsset

get spriteAsset(): string
Gets the id of the pc-asset to use for the sprite.

Returns string
The sprite asset ID.
- Defined in src/components/element-component.ts:441
set spriteAsset(value: string): void
Sets the id of the pc-asset to use for the sprite (image elements only).
Parameters
- value: string
  The sprite asset ID.
Returns void
- Defined in src/components/element-component.ts:429

spriteFrame

get spriteFrame(): number
Gets the frame of the sprite to render.

Returns number
The sprite frame index.
- Defined in src/components/element-component.ts:460
set spriteFrame(value: number): void
Sets the frame of the sprite to render (image elements only).
Parameters
- value: number
  The sprite frame index.
Returns void
- Defined in src/components/element-component.ts:449

text

get text(): string
Gets the text of the element component.

Returns string
The text.
- Defined in src/components/element-component.ts:479
set text(value: string): void
Sets the text of the element component.
Parameters
- value: string
  The text.
Returns void
- Defined in src/components/element-component.ts:468

textureAsset

get textureAsset(): string
Gets the id of the pc-asset to use for the texture.

Returns string
The texture asset ID.
- Defined in src/components/element-component.ts:499
set textureAsset(value: string): void
Sets the id of the pc-asset to use for the texture (image elements only).
Parameters
- value: string
  The texture asset ID.
Returns void
- Defined in src/components/element-component.ts:487

type

get type(): "image" | "text" | "group"
Gets the type of the element component.

Returns "image" | "text" | "group"
The type.
- Defined in src/components/element-component.ts:518
set type(value: "image" | "text" | "group"): void
Sets the type of the element component.
Parameters
- value: "image" | "text" | "group"
  The type.
Returns void
- Defined in src/components/element-component.ts:507

useInput

get useInput(): boolean
Gets whether the element component accepts input events.

Returns boolean
Whether the element accepts input.
- Defined in src/components/element-component.ts:537
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
- Defined in src/components/element-component.ts:526

width

get width(): number
Gets the width of the element component.

Returns number
The width.
- Defined in src/components/element-component.ts:556
set width(value: number): void
Sets the width of the element component.
Parameters
- value: number
  The width.
Returns void
- Defined in src/components/element-component.ts:545

wrapLines

get wrapLines(): boolean
Gets whether the element component should wrap lines.

Returns boolean
Whether to wrap lines.
- Defined in src/components/element-component.ts:575
set wrapLines(value: boolean): void
Sets whether the element component should wrap lines.
Parameters
- value: boolean
  Whether to wrap lines.
Returns void
- Defined in src/components/element-component.ts:564

Methods

`Protected`_onReady

_onReady(): void
Called when the element is fully initialized and ready. Subclasses should call this when they're ready.

Returns void
Inherited from ComponentElement._onReady
- Defined in src/async-element.ts:32

ready

ready(): Promise<ElementComponentElement>
Returns a promise that resolves with this element when it's ready.

Returns Promise<ElementComponentElement>
A promise that resolves with this element when it's ready.
Inherited from ComponentElement.ready
- Defined in src/async-element.ts:41

Class ElementComponentElement

Hierarchy (View Summary)

Index

Accessors

Methods

Accessors

anchor

Returns Vec4

Parameters

Returns void

asset

Returns string

Parameters

Returns void

autoFitHeight

Returns boolean

Parameters

Returns void

autoFitWidth

Returns boolean

Parameters

Returns void

autoHeight

Returns boolean

Parameters

Returns void

autoWidth

Returns boolean

Parameters

Returns void

color

Returns Color

Parameters

Returns void

component

Returns ElementComponent | null

enabled

Returns boolean

Parameters

Returns void

enableMarkup

Returns boolean

Parameters

Returns void

fontSize

Returns number

Parameters

Returns void

height

Returns number

Parameters

Returns void

lineHeight

Returns number

Parameters

Returns void

margin

Returns Vec4 | null

Parameters

Returns void

mask

Returns boolean

Parameters

Returns void

maxFontSize

Returns number

Parameters

Returns void

minFontSize

Returns number

Parameters

Returns void

opacity

Returns number

Parameters

Returns void

pivot

Returns Vec2

Parameters

Returns void

`Protected`_onReady