Documentation / @debuffjp/input / TouchControls

Class: TouchControls

Defined in: touch.ts:100

On-screen controls for touch screens: a stick and buttons that feed the same actions as keys and pads.

const input = new Input(game, {
  bindings: {
    left: ["ArrowLeft", "PadStickLeft", "TouchStickLeft"],
    right: ["ArrowRight", "PadStickRight", "TouchStickRight"],
    jump: ["Space", "PadA", "TouchA"],
  },
});
const touch = new TouchControls(game, input, {
  stick: { x: 40, y: -40, zone: [0, 0, 160, -1] }, // floats anywhere on the left
  buttons: { A: { x: -32, y: -32 } },
});
// in render, outside the camera:
touch.draw(draw);

Each contact belongs to the control it started on until the finger lifts, so sliding off a button keeps it held and the stick keeps its thumb. The contacts are the pointer's (input.pointer.touches), so they also move the primary pointer; check touch.holding or touch.owns(id) to ignore them in pointer code. Tests and agents drive it with input.pointer.touchStart, touchMove and touchEnd.

How the controls look is the game's call: draw() is plain circles; read stick and buttons to draw your own.

Constructors

Constructor

new TouchControls(host, input, options): TouchControls

Defined in: touch.ts:110

Parameters

host

TouchHost

input

Input<string>

options

TouchControlsOptions

Returns

TouchControls

Properties

buttons

readonly buttons: Record<string, TouchButton> = {}

Defined in: touch.ts:103

---

stick

readonly stick: TouchStick | undefined

Defined in: touch.ts:102

Undefined when there's no stick.

---

visible

visible: boolean

Defined in: touch.ts:105

Whether draw() draws anything, and whether controls take touches. Set it yourself to override show.

Accessors

holding

Get Signature

get holding(): boolean

Defined in: touch.ts:132

A control is held.

Returns

boolean

Methods

dispose()

dispose(): void

Defined in: touch.ts:162

Stop reading touches and remove the controls' sources from the input.

Returns

void

---

draw()

draw(draw, style?): void

Defined in: touch.ts:142

Plain circles for the stick and buttons, in logical units: call it outside withCamera.

Parameters

draw

TouchDraw

style?

alpha?

number

color?

string | number

Returns

void

---

owns()

owns(id): boolean

Defined in: touch.ts:137

Contact id (a TouchPoint.id) belongs to a control.

Parameters

id

number

Returns

boolean