Class: ButtonComponent

pc.ButtonComponent

A ButtonComponent enables a group of entities to behave like a button, with different visual states for hover and press interactions.

Constructor

new ButtonComponent(system, entity)

Create a new ButtonComponent.
Parameters:
Name Type Description
system pc.ButtonComponentSystem The ComponentSystem that created this Component
entity pc.Entity The Entity that this Component is attached to.
Properties:
Name Type Description
active Boolean If set to false, the button will be visible but will not respond to hover or touch interactions.
imageEntity pc.Entity A reference to the entity to be used as the button background. The entity must have an ImageElement component.
hitPadding pc.Vec4 Padding to be used in hit-test calculations. Can be used to expand the bounding box so that the button is easier to tap.
transitionMode pc.BUTTON_TRANSITION_MODE Controls how the button responds when the user hovers over it/presses it.
hoverTint pc.Color Color to be used on the button image when the user hovers over it.
pressedTint pc.Color Color to be used on the button image when the user presses it.
inactiveTint pc.Color Color to be used on the button image when the button is not interactive.
fadeDuration Number Duration to be used when fading between tints, in milliseconds.
hoverSpriteAsset pc.Asset Sprite to be used as the button image when the user hovers over it.
hoverSpriteFrame Number Frame to be used from the hover sprite.
pressedSpriteAsset pc.Asset Sprite to be used as the button image when the user presses it.
pressedSpriteFrame Number Frame to be used from the pressed sprite.
inactiveSpriteAsset pc.Asset Sprite to be used as the button image when the button is not interactive.
inactiveSpriteFrame Number Frame to be used from the inactive sprite.
Source:

Extends

Events

click

Fired when the mouse is pressed and released on the component or when a touch starts and ends on the component.
Parameters:
Name Type Description
event pc.ElementMouseEvent | pc.ElementTouchEvent The event
Source:

hoverend

Fired when the button changes state to be not hovered
Source:

hoverstart

Fired when the button changes state to be hovered
Source:

mousedown

Fired when the mouse is pressed while the cursor is on the component.
Parameters:
Name Type Description
event pc.ElementMouseEvent The event
Source:

mouseenter

Fired when the mouse cursor enters the component.
Parameters:
Name Type Description
event pc.ElementMouseEvent The event
Source:

mouseleave

Fired when the mouse cursor leaves the component.
Parameters:
Name Type Description
event pc.ElementMouseEvent The event
Source:

mouseup

Fired when the mouse is released while the cursor is on the component.
Parameters:
Name Type Description
event pc.ElementMouseEvent The event
Source:

pressedend

Fired when the button changes state to be not pressed
Source:

pressedstart

Fired when the button changes state to be pressed
Source:

touchcancel

Fired when a touch is cancelled on the component.
Parameters:
Name Type Description
event pc.ElementTouchEvent The event
Source:

touchend

Fired when a touch ends on the component.
Parameters:
Name Type Description
event pc.ElementTouchEvent The event
Source:

touchleave

Fired when a touch leaves the component.
Parameters:
Name Type Description
event pc.ElementTouchEvent The event
Source:

touchstart

Fired when a touch starts on the component.
Parameters:
Name Type Description
event pc.ElementTouchEvent The event
Source: