phaser virtual joystick plugin

Code Templates – Phaser Virtual Joystick Plugin

Plugin by Phaser’s creator Richard Davey


Join 300,000+ Satisfied Students


The Phaser Virtual Joystick Plugin allows you to easily add mobile friendly joysticks, d-pads and buttons to your games (Phaser version 2.x). The plugin comes with three high-resolution professionally designed skins. So the joysticks will both look great and respond quickly. Photoshop PSD files are also included allowing you to create further skins.

The user friendly API means you’ll be running in seconds. Creating a joystick is as simple as activating the plugin and calling one command:

var pad = game.plugins.add(Phaser.VirtualJoystick);
var stick = pad.addStick(x, y, distance, 'arcade');

There are a wealth of properties and methods exposed for your game code, allowing you to configure the joysticks and buttons as needed.


  • 3 professionally designed high-resolution Joystick skins and Button states
  • Each skin includes Photoshop PSD files for customization
  • Supports Analogue Joysticks, Digital (DPad) Joysticks, and Buttons
  • Adds just 3.3KB to your game download size
  • Create as many joysticks as you need on-screen at once. Dual-stick shooter? No problem!
  • Create as many Buttons as you need, each with their own style and events
  • Joystick events: onDown, onUp, onMove and onUpdate
  • Adjust the sensitivity of the Joystick
  • Uses a custom Input Manager that won’t conflict with any input enabled Game Objects
  • Joysticks can be axis locked so they only move horizontally or vertically
  • Includes DPad class for the classic retro feel! For fixed-axis 4-way movement
  • Renders outside of the game World, so not impacted by scaling or camera movement
  • Joysticks and Buttons can be easily positioned, scaled, alpha’d or made invisible
  • Joysticks can be set to only appear when the player touches the screen
  • Easily read the force of the joystick both globally and per axis
  • Easily read the angle of the joystick in multiple formats
  • Create a Joystick ‘dead zone’ inside of which events are not processed
  • Control the Button repeat rate – how often it should ‘fire’
  • Includes properties for easy use with shaders
  • Handy debug method visually renders the hit areas and joystick values
  • Works across mobile and desktop browsers
  • Works under Chrome Mobile Emulation including multi-touch environments
  • Getting Started Guide – You’ll be coding in next to no time
  • 14 Code Examples included
  • Extensive JSDoc API Documentation – all properties and all methods
  • Free Upgrades
  • License free – Use it in commercial games
  • Ready built and minified source files
  • Works with Phaser 2.2 and above

The plugin is delivered via immediate download. It includes the full plugin source code, examples, API documentation, Photoshop files and a manual.

+ Show More