Class ButtonComponentElement

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

Hierarchy (View Summary)

ComponentElement
- ButtonComponentElement

Index

Accessors

active component enabled fadeDuration hitPadding hoverSpriteAsset hoverSpriteFrame hoverTint image inactiveSpriteAsset inactiveSpriteFrame inactiveTint pressedSpriteAsset pressedSpriteFrame pressedTint transitionMode

Methods

_onReady ready

Accessors

active

get active(): boolean
Gets whether the button is active.

Returns boolean
Whether the button is active.
- Defined in src/components/button-component.ts:116
set active(value: boolean): void
Sets whether the button is active and responds to input.
Parameters
- value: boolean
  Whether the button is active.
Returns void
- Defined in src/components/button-component.ts:105

component

get component(): ButtonComponent | null
Gets the underlying PlayCanvas button component.

Returns ButtonComponent | null
The button component.
Overrides ComponentElement.component
- Defined in src/components/button-component.ts:97

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

fadeDuration

get fadeDuration(): number
Gets the duration over which tint transitions are applied.

Returns number
The fade duration.
- Defined in src/components/button-component.ts:254
set fadeDuration(value: number): void
Sets the duration (in milliseconds) over which tint transitions are applied.
Parameters
- value: number
  The fade duration.
Returns void
- Defined in src/components/button-component.ts:243

hitPadding

get hitPadding(): Vec4
Gets the padding used to expand the button's hit area.

Returns Vec4
The hit padding.
- Defined in src/components/button-component.ts:156
set hitPadding(value: Vec4): void
Sets the padding used to expand the button's hit area, as a Vec4 (left, bottom, right, top).
Parameters
- value: Vec4
  The hit padding.
Returns void
- Defined in src/components/button-component.ts:145

hoverSpriteAsset

get hoverSpriteAsset(): string
Gets the id of the pc-asset sprite shown when the button is hovered.

Returns string
The hover sprite asset id.
- Defined in src/components/button-component.ts:275
set hoverSpriteAsset(value: string): void
Sets the id of the pc-asset sprite shown when the button is hovered (sprite transition mode).
Parameters
- value: string
  The hover sprite asset id.
Returns void
- Defined in src/components/button-component.ts:263

hoverSpriteFrame

get hoverSpriteFrame(): number
Gets the frame of the hover sprite to show.

Returns number
The hover sprite frame.
- Defined in src/components/button-component.ts:294
set hoverSpriteFrame(value: number): void
Sets the frame of the hover sprite to show.
Parameters
- value: number
  The hover sprite frame.
Returns void
- Defined in src/components/button-component.ts:283

hoverTint

get hoverTint(): Color
Gets the hover tint color.

Returns Color
The hover tint.
- Defined in src/components/button-component.ts:195
set hoverTint(value: Color): void
Sets the tint color applied to the image entity when the button is hovered (tint transition mode).
Parameters
- value: Color
  The hover tint.
Returns void
- Defined in src/components/button-component.ts:184

image

get image(): string
Gets the reference to the <pc-entity> whose image element is used for visual transitions.

Returns string
The image entity reference.
- Defined in src/components/button-component.ts:137
set image(value: string): void
Sets the reference (CSS selector, element id or entity name) to the <pc-entity> whose image element is used for visual transitions. Defaults to the button's own entity.
Parameters
- value: string
  The image entity reference.
Returns void
- Defined in src/components/button-component.ts:125

inactiveSpriteAsset

get inactiveSpriteAsset(): string
Gets the id of the pc-asset sprite shown when the button is inactive.

Returns string
The inactive sprite asset id.
- Defined in src/components/button-component.ts:355
set inactiveSpriteAsset(value: string): void
Sets the id of the pc-asset sprite shown when the button is inactive (sprite transition mode).
Parameters
- value: string
  The inactive sprite asset id.
Returns void
- Defined in src/components/button-component.ts:343

inactiveSpriteFrame

get inactiveSpriteFrame(): number
Gets the frame of the inactive sprite to show.

Returns number
The inactive sprite frame.
- Defined in src/components/button-component.ts:374
set inactiveSpriteFrame(value: number): void
Sets the frame of the inactive sprite to show.
Parameters
- value: number
  The inactive sprite frame.
Returns void
- Defined in src/components/button-component.ts:363

inactiveTint

get inactiveTint(): Color
Gets the inactive tint color.

Returns Color
The inactive tint.
- Defined in src/components/button-component.ts:235
set inactiveTint(value: Color): void
Sets the tint color applied to the image entity when the button is inactive (tint transition mode).
Parameters
- value: Color
  The inactive tint.
Returns void
- Defined in src/components/button-component.ts:224

pressedSpriteAsset

get pressedSpriteAsset(): string
Gets the id of the pc-asset sprite shown when the button is pressed.

Returns string
The pressed sprite asset id.
- Defined in src/components/button-component.ts:315
set pressedSpriteAsset(value: string): void
Sets the id of the pc-asset sprite shown when the button is pressed (sprite transition mode).
Parameters
- value: string
  The pressed sprite asset id.
Returns void
- Defined in src/components/button-component.ts:303

pressedSpriteFrame

get pressedSpriteFrame(): number
Gets the frame of the pressed sprite to show.

Returns number
The pressed sprite frame.
- Defined in src/components/button-component.ts:334
set pressedSpriteFrame(value: number): void
Sets the frame of the pressed sprite to show.
Parameters
- value: number
  The pressed sprite frame.
Returns void
- Defined in src/components/button-component.ts:323

pressedTint

get pressedTint(): Color
Gets the pressed tint color.

Returns Color
The pressed tint.
- Defined in src/components/button-component.ts:215
set pressedTint(value: Color): void
Sets the tint color applied to the image entity when the button is pressed (tint transition mode).
Parameters
- value: Color
  The pressed tint.
Returns void
- Defined in src/components/button-component.ts:204

transitionMode

get transitionMode(): number
Gets how the button reacts to being hovered/pressed.

Returns number
The transition mode.
- Defined in src/components/button-component.ts:175
set transitionMode(value: number): void
Sets how the button reacts to being hovered/pressed. Can be tint (0) or sprite (1).
Parameters
- value: number
  The transition mode.
Returns void
- Defined in src/components/button-component.ts:164

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<ButtonComponentElement>
Returns a promise that resolves with this element when it's ready.

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

Class ButtonComponentElement

Hierarchy (View Summary)

Index

Accessors

Methods

Accessors

active

Returns boolean

Parameters

Returns void

component

Returns ButtonComponent | null

enabled

Returns boolean

Parameters

Returns void

fadeDuration

Returns number

Parameters

Returns void

hitPadding

Returns Vec4

Parameters

Returns void

hoverSpriteAsset

Returns string

Parameters

Returns void

hoverSpriteFrame

Returns number

Parameters

Returns void

hoverTint

Returns Color

Parameters

Returns void

image

Returns string

Parameters

Returns void

inactiveSpriteAsset

Returns string

Parameters

Returns void

inactiveSpriteFrame

Returns number

Parameters

Returns void

inactiveTint

Returns Color

Parameters

Returns void

pressedSpriteAsset

Returns string

Parameters

Returns void

pressedSpriteFrame

Returns number

Parameters

Returns void

pressedTint

Returns Color

Parameters

Returns void

transitionMode

Returns number

Parameters

Returns void

Methods

Protected_onReady

Returns void

ready

Returns Promise<ButtonComponentElement>

Settings

On This Page

`Protected`_onReady