skills.rest
kehwar
kehwarCOMMUNITY
Explore all skills by this author →
GitHub

input-keyboard-mouse-touch

Handle keyboard, mouse, touch, pointer, drag, drop, and gamepad input in Phaser 4.

Updated Apr 26, 2026
Search Tags:#keyboard#drag-and-drop#phaser#touch#input#mouse#gamepad
One-click install
npx skills add https://github.com/kehwar/pixi-square --skill input-keyboard-mouse-touch-kehwar
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: input-keyboard-mouse-touch
Source: https://github.com/kehwar/pixi-square/tree/main/.agents/skills/input-keyboard-mouse-touch
Command: npx skills add https://github.com/kehwar/pixi-square --skill input-keyboard-mouse-touch-kehwar

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Handling user input in Phaser 4 across keyboard and pointer interactions, touch events, drag-and-drop, hit areas, and gamepad support in a single unified system.

Core Features & Use Cases

  • Access input via this.input and easily make objects interactive with setInteractive, attach drag-and-drop, and define hit areas.
  • Handle a broad set of events: keyboard, pointer (down/move/up, wheel), drag/drop, and gamepad, with per-object and scene-wide event levels.
  • Support multi-pointer scenarios, flexible hit areas (circle, rectangle, polygon), and optional pixel-perfect hit testing for irregular visuals.
  • Use case: build a Phaser 4 game where the player moves with a keyboard, selects objects with the mouse or touch, drags items into inventory, and uses a connected gamepad for movement.

Quick Start

Create a Scene that uses this.input to handle keyboard, mouse, touch, and gamepad input with interactive objects.

Frequently Asked Questions about input-keyboard-mouse-touch

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle keyboard and touch input in Phaser 4?▼

Phaser 4 input handling is unified through this.input, allowing you to manage keyboard, mouse, touch, and gamepad events within a single scene for responsive controls.

How do I make objects interactive with setInteractive and define hit areas?▼

Use setInteractive to make objects responsive to pointer events, defining flexible hit areas like circles, rectangles, or polygons, with optional pixel-perfect testing for irregular visuals.

Does Phaser 4 support multi-pointer drag-and-drop interactions?▼

Yes, Phaser 4 supports multi-pointer scenarios, enabling drag-and-drop interactions across multiple pointers simultaneously for moving items into inventory slots.

Can I use a connected gamepad for movement alongside mouse selection?▼

Yes, unified input handling lets players move with a connected gamepad while selecting objects via mouse or touch, combining multiple input methods within the same scene.

What is the best way to unify drag and drop events with keyboard controls?▼

Attach drag/drop events directly to interactive objects while listening for keyboard events at the scene level, managing both through this.input for a cohesive control system.

How do pointer events like wheel and down/move/up work in Phaser 4?▼

Pointer events including down, move, up, and wheel are handled at both per-object and scene-wide levels, providing granular control over mouse and touch interactions.

Related Skills

Explore More Software Engineering Skills→
simon-tannasimon-tanna

input-keyboard-mouse-touch

Manage keyboard, mouse, touch, and gamepad input for Phaser 4 games.

Community
Advanced
phaserjsphaserjs
40.1k

input-keyboard-mouse-touch

Unify keyboard, mouse, touch, pointer, drag, and gamepad input for Phaser 4 scenes.

Official
Advanced
quochung-cyouquochung-cyou

input-keyboard-mouse-touch

Handle keyboard, mouse, touch, and gamepad inputs in Phaser 4 games.

Community
Intermediate
ElementTechElementTech
2

threejs-interaction

Handle user input in Three.js scenes with raycasting and OrbitControls.

Community
Intermediate