Class: ValueTouchButton<S>

A touchscreen button which displays the value of a bound state.

The root element of the button contains the touch-button-value CSS class by default, in addition to all root-element classes used by TouchButton.

The value of the button's bound state is rendered into a child div element containing the CSS class touch-button-value-value.

Type parameters

Name	Type
S	extends Subscribable<any>

Hierarchy

• DisplayComponent<ValueTouchButtonProps<S>>

  ↳ ValueTouchButton

Constructors

constructor

• new ValueTouchButton<S>(props): ValueTouchButton<S>

Creates an instance of a DisplayComponent.

Type parameters

Name	Type
S	extends Subscribable<any>

Parameters

Name	Type	Description
props	ValueTouchButtonProps<S>	The propertis of the component.

Returns

ValueTouchButton<S>

Inherited from

DisplayComponent<ValueTouchButtonProps<S>>.constructor

Defined in

src/sdk/components/FSComponent.ts:73

Properties

buttonRef

• Protected Readonly buttonRef: NodeReference<TouchButton<TouchButtonProps>>

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:95

---

context

• Optional context: [] = undefined

The context on this component, if any.

Inherited from

DisplayComponent.context

Defined in

src/sdk/components/FSComponent.ts:64

---

contextType

• Optional Readonly contextType: readonly [] = undefined

The type of context for this component, if any.

Inherited from

DisplayComponent.contextType

Defined in

src/sdk/components/FSComponent.ts:67

---

cssClassSet

• Protected Readonly cssClassSet: SetSubject<string>

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:98

---

props

• props: ValueTouchButtonProps<S> & ComponentProps

The properties of the component.

Inherited from

DisplayComponent.props

Defined in

src/sdk/components/FSComponent.ts:61

---

renderedValue

• Protected Optional renderedValue: string | VNode

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:100

---

valueRef

• Protected Readonly valueRef: NodeReference<HTMLDivElement>

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:96

---

RESERVED_CSS_CLASSES

▪ Static Protected Readonly RESERVED_CSS_CLASSES: Set<string>

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:93

Methods

cleanUpRenderedValue

▸ cleanUpRenderedValue(): void

Cleans up this button's rendered value.

Returns

void

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:154

---

destroy

▸ destroy(): void

Returns

void

Inherit Doc

Overrides

DisplayComponent.destroy

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:298

---

getContext

▸ getContext(context): never

Gets a context data subscription from the context collection.

Parameters

Name	Type	Description
context	never	The 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

Defined in

src/sdk/components/FSComponent.ts:106

---

getReservedCssClasses

▸ getReservedCssClasses(): ReadonlySet<string>

Gets the CSS classes that are reserved for this button's root element.

Returns

ReadonlySet<string>

The CSS classes that are reserved for this button's root element.

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:293

---

getRootElement

▸ getRootElement(): HTMLElement

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.

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:121

---

onAfterRender

▸ onAfterRender(): void

Returns

void

Inherit Doc

Overrides

DisplayComponent.onAfterRender

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:106

---

onBeforeRender

▸ onBeforeRender(): void

A callback that is called before the component is rendered.

Returns

void

Inherited from

DisplayComponent.onBeforeRender

Defined in

src/sdk/components/FSComponent.ts:80

---

onHoldEnded

▸ onHoldEnded(button, totalHoldDuration, endReason): void

Responds to when this button exits the held state.

Parameters

Name	Type	Description
button	TouchButton<TouchButtonProps>	The button that was held.
totalHoldDuration	number	The total amount of time, in milliseconds, that this button was held.
endReason	TouchButtonHoldEndReason	The reason that this button exited the held state.

Returns

void

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:235

---

onHoldStarted

▸ onHoldStarted(button): TouchButtonHoldAction

Responds to when this button enters the held state.

Parameters

Name	Type	Description
button	TouchButton<TouchButtonProps>	The button that is held.

Returns

TouchButtonHoldAction

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

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:208

---

onHoldTick

▸ onHoldTick(button, dt, totalTime, timeSinceLastPress): TouchButtonHoldAction

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

Parameters

Name	Type	Description
button	TouchButton<TouchButtonProps>	The button that is held.
dt	number	The elapsed time, in milliseconds, since the previous frame.
totalTime	number	The total amount of time, in milliseconds, that this button has been held.
timeSinceLastPress	number	The 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.

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:223

---

onPressed

▸ onPressed(button, isHeld): void

Responds to when this button is pressed.

Parameters

Name	Type	Description
button	TouchButton<TouchButtonProps>	The button that was pressed.
isHeld	boolean	Whether the button was held when it was pressed.

Returns

void

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:198

---

onTouched

▸ onTouched(button): TouchButtonOnTouchedAction

Responds to when this button is touched.

Parameters

Name	Type	Description
button	TouchButton<TouchButtonProps>	The button that was touched.

Returns

TouchButtonOnTouchedAction

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

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:187

---

processRenderedValue

▸ processRenderedValue(rendered): void

Processes a newly rendered value. The new rendered value will rendered into this button's value container, replacing any existing rendered value.

Parameters

Name	Type	Description
rendered	string | VNode	The newly rendered value.

Returns

void

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:139

---

render

▸ render(): VNode

Returns

VNode

Inherit Doc

Overrides

DisplayComponent.render

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:240

---

renderValueContainer

▸ renderValueContainer(): VNode

Renders this button's value container.

Returns

VNode

This button's rendered value container.

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:279

---

simulatePressed

▸ simulatePressed(ignoreDisabled?): void

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

Parameters

Name	Type	Default value	Description
ignoreDisabled	boolean	false	Whether to simulate the button being pressed regardless of whether the button is disabled. Defaults to false.

Returns

void

Defined in

src/garminsdk/components/touchbutton/ValueTouchButton.tsx:130