Create

VirtualDpad

On-screen directional pad for touch devices. Renders four arrow buttons (up/down/left/right) and tracks which directions are currently pressed. Automatically shows on touch devices, hides on desktop.

VirtualDpad

On-screen directional pad for touch devices. Renders four arrow buttons (up/down/left/right) and tracks which directions are currently pressed. Automatically shows on touch devices, hides on desktop.

Examples

const dpad = new VirtualDpad();
const input = new GamepadInput({ up: { keys: ["ArrowUp"] } });
 
function loop() {
  const upPressed = dpad.isDown("up") || input.isDown("up");
  if (upPressed) player.moveUp();
  requestAnimationFrame(loop);
}

Members

isDown

isDown(dir: DpadDirection): boolean

True while the specified direction is pressed.

show

show(): void

Forces the pad to render even on non-touch devices.

hide

hide(): void

Hides the pad regardless of device heuristics.

destroy

destroy(): void

Removes DOM nodes and clears active state.