Skip to main content

Class: BgImgTouchButton

Defined in: src/garminsdk/components/touchbutton/BgImgTouchButton.tsx:24

A touchscreen button which uses different images for its "up" state and "down" state backgrounds and displays an optional label.

The root element of the button contains the bg-img-touch-button CSS class by default, in addition to all root-element classes used by TouchButton, with the exception of touch-button itself.

The root element contains optional child <img> elements with the CSS classes bg-img-touch-button-up-img and bg-img-touch-button-down-img as well as an optional label element with the CSS class bg-img-touch-button-label.

Extends

Constructors

Constructor

new BgImgTouchButton(props): BgImgTouchButton

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

Creates an instance of a DisplayComponent.

Parameters

ParameterTypeDescription
propsBgImgTouchButtonPropsThe propertis of the component.

Returns

BgImgTouchButton

Inherited from

TouchButton.constructor

Properties

context?

optional context: [] = undefined

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

The context on this component, if any.

Inherited from

TouchButton.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

TouchButton.contextType


cssClassSet

protected readonly cssClassSet: SetSubject<string>

Defined in: src/garminsdk/components/touchbutton/BgImgTouchButton.tsx:34

Overrides

TouchButton.cssClassSet


cssClassSub?

protected optional cssClassSub: Subscription

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:241

Inherited from

TouchButton.cssClassSub


currentMousePosition

protected readonly currentMousePosition: Vec2

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:244

Inherited from

TouchButton.currentMousePosition


downImgSrc

protected readonly downImgSrc: undefined | MappedSubscribable<string>

Defined in: src/garminsdk/components/touchbutton/BgImgTouchButton.tsx:39


dragThresholdPxActual

protected readonly dragThresholdPxActual: number

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:248

Inherited from

TouchButton.dragThresholdPxActual


focusOnDrag

protected readonly focusOnDrag: boolean

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:246

Inherited from

TouchButton.focusOnDrag


holdTickInterval

protected holdTickInterval: null | Timer = null

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:210

Inherited from

TouchButton.holdTickInterval


holdTimeSinceLastPress

protected holdTimeSinceLastPress: number = 0

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:213

Inherited from

TouchButton.holdTimeSinceLastPress


inhibitOnDrag

protected readonly inhibitOnDrag: boolean

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:247

Inherited from

TouchButton.inhibitOnDrag


inhibitOnDragAxisActual

protected readonly inhibitOnDragAxisActual: "both" | "x" | "y"

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:249

Inherited from

TouchButton.inhibitOnDragAxisActual


isEnabled

protected readonly isEnabled: Subscribable<boolean> | Subscribable<false> | Subscribable<true>

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:199

Inherited from

TouchButton.isEnabled


isEnabledSub?

protected optional isEnabledSub: Subscription

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:238

Inherited from

TouchButton.isEnabledSub


isHeld

protected isHeld: boolean = false

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:208

Inherited from

TouchButton.isHeld


isHighlighted

protected readonly isHighlighted: Subscribable<boolean> | Subscribable<false> | Subscribable<true>

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:200

Inherited from

TouchButton.isHighlighted


isHighlightedSub?

protected optional isHighlightedSub: Subscription

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:239

Inherited from

TouchButton.isHighlightedSub


isPrimed

protected isPrimed: boolean = false

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:207

Inherited from

TouchButton.isPrimed


isVisible

protected readonly isVisible: Subscribable<boolean> | Subscribable<false> | Subscribable<true>

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:201

Inherited from

TouchButton.isVisible


isVisibleSub?

protected optional isVisibleSub: Subscription

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:240

Inherited from

TouchButton.isVisibleSub


labelContent

protected readonly labelContent: undefined | string | VNode | MappedSubscribable<string>

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:203

Inherited from

TouchButton.labelContent


lastHoldTickTime

protected lastHoldTickTime: undefined | number = undefined

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:211

Inherited from

TouchButton.lastHoldTickTime


mouseClickPosition

protected readonly mouseClickPosition: Vec2

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:243

Inherited from

TouchButton.mouseClickPosition


mouseDownListener()

protected readonly mouseDownListener: (e) => void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:194

Responds to mouse down events on this button's root element.

Parameters

ParameterTypeDescription
eMouseEventThe mouse event.

Returns

void

Inherited from

TouchButton.mouseDownListener


mouseLeaveListener()

protected readonly mouseLeaveListener: (e) => void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:196

Responds to mouse leave events on this button's root element.

Parameters

ParameterTypeDescription
eMouseEventThe mouse event.

Returns

void

Inherited from

TouchButton.mouseLeaveListener


mouseMoveListener()

protected readonly mouseMoveListener: (e) => void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:197

Handle mouse moving after clicking.

Parameters

ParameterTypeDescription
eMouseEventThe mouse event.

Returns

void

Inherited from

TouchButton.mouseMoveListener


mouseUpListener()

protected readonly mouseUpListener: () => void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:195

Responds to mouse up events on this button's root element.

Returns

void

Inherited from

TouchButton.mouseUpListener


props

props: BgImgTouchButtonProps & ComponentProps

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

The properties of the component.

Inherited from

TouchButton.props


rootRef

protected readonly rootRef: NodeReference<HTMLDivElement>

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:190

Inherited from

TouchButton.rootRef


totalHoldTime

protected totalHoldTime: number = 0

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:212

Inherited from

TouchButton.totalHoldTime


upImgSrc

protected readonly upImgSrc: undefined | MappedSubscribable<string>

Defined in: src/garminsdk/components/touchbutton/BgImgTouchButton.tsx:36


RESERVED_CSS_CLASSES

protected readonly static RESERVED_CSS_CLASSES: Set<string>

Defined in: src/garminsdk/components/touchbutton/BgImgTouchButton.tsx:25

Overrides

TouchButton.RESERVED_CSS_CLASSES

Methods

destroy()

destroy(): void

Defined in: src/garminsdk/components/touchbutton/BgImgTouchButton.tsx:68

Returns

void

Inherit Doc

Overrides

TouchButton.destroy


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

TouchButton.getContext


getDragDistance()

protected getDragDistance(): number

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:487

Get the distance that the mouse has been dragged on the correct axis.

Returns

number

The distance.

Inherited from

TouchButton.getDragDistance


getReservedCssClasses()

protected getReservedCssClasses(): ReadonlySet<string>

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:540

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.

Inherited from

TouchButton.getReservedCssClasses


getRootElement()

getRootElement(): HTMLElement

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:293

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.

Inherited from

TouchButton.getRootElement


holdTickFunc()

protected readonly holdTickFunc(): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:215

Returns

void

Inherited from

TouchButton.holdTickFunc


onAfterRender()

onAfterRender(node): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:253

Parameters

ParameterType
nodeVNode

Returns

void

Inherit Doc

Inherited from

TouchButton.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

TouchButton.onBeforeRender


onMouseDown()

protected onMouseDown(e): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:390

Responds to mouse down events on this button's root element.

Parameters

ParameterTypeDescription
eMouseEventThe mouse event.

Returns

void

Inherited from

TouchButton.onMouseDown


onMouseLeave()

protected onMouseLeave(e): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:439

Responds to mouse leave events on this button's root element.

Parameters

ParameterTypeDescription
eMouseEventThe mouse event.

Returns

void

Inherited from

TouchButton.onMouseLeave


onMouseMove()

protected onMouseMove(e): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:460

Handle mouse moving after clicking.

Parameters

ParameterTypeDescription
eMouseEventThe mouse event.

Returns

void

Inherited from

TouchButton.onMouseMove


onMouseUp()

protected onMouseUp(): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:426

Responds to mouse up events on this button's root element.

Returns

void

Inherited from

TouchButton.onMouseUp


onPressed()

protected onPressed(): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:498

Responds to when this button is pressed.

Returns

void

Inherited from

TouchButton.onPressed


render()

render(): VNode

Defined in: src/garminsdk/components/touchbutton/BgImgTouchButton.tsx:43

Returns

VNode

Inherit Doc

Overrides

TouchButton.render


renderLabel()

protected renderLabel(): null | VNode

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:526

Renders this button's label.

Returns

null | VNode

This button's rendered label, or null if this button does not have a label.

Inherited from

TouchButton.renderLabel


setHeld()

protected setHeld(isHeld, endReason): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:342

Sets the held state of this button.

Parameters

ParameterTypeDefault valueDescription
isHeldbooleanundefinedThe new held state.
endReasonTouchButtonHoldEndReasonTouchButtonHoldEndReason.UnknownThe reason that the held state is set to false. Ignored if isHeld is true. Defaults to TouchButtonHoldEndReason.Unknown.

Returns

void

Inherited from

TouchButton.setHeld


setPrimed()

protected setPrimed(isPrimed): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:312

Sets the primed state of this button.

Parameters

ParameterTypeDescription
isPrimedbooleanThe new primed state.

Returns

void

Inherited from

TouchButton.setPrimed


simulatePressed()

simulatePressed(ignoreDisabled): void

Defined in: src/garminsdk/components/touchbutton/TouchButton.tsx:302

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

Inherited from

TouchButton.simulatePressed