Skip to main content

Class: UiValueTouchButton<S>

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:139

A G3X Touch UI version of ValueTouchButton. Supports UI focus, enables focus on drag by default and provides convenience props for handling drag behavior while in a scrollable list.

The root element of the button conditionally contains the ui-button-focused CSS class when the button has UI focus.

Extends​

Type Parameters​

Type Parameter
S extends Subscribable<any>

Implements​

Constructors​

Constructor​

new UiValueTouchButton<S>(props): UiValueTouchButton<S>

Defined in: src/sdk/components/FSComponent.ts:73

Creates an instance of a DisplayComponent.

Parameters​

ParameterTypeDescription
propsUiValueTouchButtonPropsThe propertis of the component.

Returns​

UiValueTouchButton<S>

Inherited from​

DisplayComponent<UiValueTouchButtonProps<S>>.constructor

Properties​

buttonRef​

protected readonly buttonRef: NodeReference<ValueTouchButton<S>>

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:143


canBeFocused​

readonly canBeFocused: Subscribable<boolean>

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:155

Whether this component can be focused.

Implementation of​

UiFocusableComponent.canBeFocused


context?​

optional context: [] = undefined

Defined in: src/sdk/components/FSComponent.ts:64

The context on this component, if any.

Inherited from​

DisplayComponent.context


contextType?​

readonly optional contextType: readonly [] = undefined

Defined in: src/sdk/components/FSComponent.ts:67

The type of context for this component, if any.

Inherited from​

DisplayComponent.contextType


focusModule​

protected readonly focusModule: UiTouchButtonFocusModule

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:145


isUiFocusableComponent​

readonly isUiFocusableComponent: true = true

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:141

Flags this component as a UiFocusableComponent.

Implementation of​

UiFocusableComponent.isUiFocusableComponent


props​

props: UiValueTouchButtonProps<S> & ComponentProps

Defined in: src/sdk/components/FSComponent.ts:61

The properties of the component.

Inherited from​

DisplayComponent.props

Methods​

destroy()​

destroy(): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:308

Returns​

void

Inherit Doc​

Overrides​

DisplayComponent.destroy


focusSelf()​

focusSelf(): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:183

Attempts to set focus on this button.

Returns​

void


getContext()​

protected getContext(context): never

Defined in: src/sdk/components/FSComponent.ts:106

Gets a context data subscription from the context collection.

Parameters​

ParameterTypeDescription
contextneverThe context to get the subscription for.

Returns​

never

The requested context.

Throws​

An error if no data for the specified context type could be found.

Inherited from​

DisplayComponent.getContext


getRootElement()​

getRootElement(): HTMLElement

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:167

Gets this button's root HTML element.

Returns​

HTMLElement

This button's root HTML element.

Throws​

Error if this button has not yet been rendered.


onAfterRender()​

onAfterRender(): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:158

Returns​

void

Inherit Doc​

Overrides​

DisplayComponent.onAfterRender


onBeforeRender()​

onBeforeRender(): void

Defined in: src/sdk/components/FSComponent.ts:80

A callback that is called before the component is rendered.

Returns​

void

Inherited from​

DisplayComponent.onBeforeRender


onDeregistered()​

onDeregistered(): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:193

Responds to when this component is deregistered with a controller.

Returns​

void

Implementation of​

UiFocusableComponent.onDeregistered


onFocusGained()​

onFocusGained(direction): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:198

Responds to when this component gains focus.

Parameters​

ParameterTypeDescription
directionUiFocusDirectionThe direction from which focus was gained.

Returns​

void

Implementation of​

UiFocusableComponent.onFocusGained


onFocusLost()​

onFocusLost(): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:204

Responds to when this component loses focus.

Returns​

void

Implementation of​

UiFocusableComponent.onFocusLost


onHoldEnded()​

protected onHoldEnded(button, state, totalHoldDuration, endReason): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:274

Responds to when this button exits the held state.

Parameters​

ParameterTypeDescription
buttonValueTouchButton<S>The button that was held.
stateSThe state that is bound to the button.
totalHoldDurationnumberThe total amount of time, in milliseconds, that this button was held.
endReasonTouchButtonHoldEndReasonThe reason that this button exited the held state.

Returns​

void


onHoldStarted()​

protected onHoldStarted(button, state): TouchButtonHoldAction

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:245

Responds to when this button enters the held state.

Parameters​

ParameterTypeDescription
buttonValueTouchButton<S>The button that is held.
stateSThe state that is bound to the button.

Returns​

TouchButtonHoldAction

The action to take. Ignored if the value is equal to TouchButtonHoldAction.EndHold.


onHoldTick()​

protected onHoldTick(button, state, dt, totalTime, timeSinceLastPress): TouchButtonHoldAction

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:261

A callback which is called every frame when this button is held.

Parameters​

ParameterTypeDescription
buttonValueTouchButton<S>The button that is held.
stateSThe state that is bound to the button.
dtnumberThe elapsed time, in milliseconds, since the previous frame.
totalTimenumberThe total amount of time, in milliseconds, that this button has been held.
timeSinceLastPressnumberThe amount of time, in milliseconds, that this button has been held since the last time the button was pressed as a tick action.

Returns​

TouchButtonHoldAction

The action to take.


onPressed()​

protected onPressed(button, state, isHeld): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:235

Responds to when this button is pressed.

Parameters​

ParameterTypeDescription
buttonValueTouchButton<S>The button that was pressed.
stateSThe state that is bound to the button.
isHeldbooleanWhether the button was held when it was pressed.

Returns​

void


onRegistered()​

onRegistered(controller): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:188

Responds to when this component is registered with a controller.

Parameters​

ParameterTypeDescription
controllerUiFocusControllerThe controller with which this component was registered.

Returns​

void

Implementation of​

UiFocusableComponent.onRegistered


onTouched()​

protected onTouched(button, state): TouchButtonOnTouchedAction

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:220

Responds to when this button is touched.

Parameters​

ParameterTypeDescription
buttonValueTouchButton<S>The button that was touched.
stateSThe state that is bound to the button.

Returns​

TouchButtonOnTouchedAction

The action to take as a result of the button being touched.


onUiInteractionEvent()​

onUiInteractionEvent(event): boolean

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:210

Handles a UiInteractionEvent.

Parameters​

ParameterTypeDescription
eventUiInteractionEventThe event to handle.

Returns​

boolean

Whether the event was handled.

Implementation of​

UiFocusableComponent.onUiInteractionEvent


render()​

render(): VNode

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:279

Returns​

VNode

Inherit Doc​

Overrides​

DisplayComponent.render


simulatePressed()​

simulatePressed(ignoreDisabled): void

Defined in: src/workingtitle-instruments-g3x-touch/html_ui/Shared/Components/TouchButton/UiValueTouchButton.tsx:176

Simulates this button being pressed. This will execute the onPressed() callback if one is defined.

Parameters​

ParameterTypeDefault valueDescription
ignoreDisabledbooleanfalseWhether to simulate the button being pressed regardless of whether the button is disabled. Defaults to false.

Returns​

void