There are several joystick scripts going around, however the few I stumbled upon had limited control sensitivity. A virtual analog controller should allow full 360 degree control (even if limited to certain directions within game-play, the system should allow for expansion/re-use), and MUST enable movement sensitivity (the character should move with a relative speed to the amount the joystick has moved).
In this post I am sharing a script I have written based on other implementations I have seen. Feel free to use it in your games.

below is the script in action
SWF Movie
If you want to skin your joystick, here is a nice inspiration link
http://dribbble.com/shots/770444-Analog-Stick/rebounds
package
{
import flash.events.Event;
import flash.events.MouseEvent;
import flash.display.MovieClip;
public class VirtualJoystick extends MovieClip
{
private var _startX:Number = 0;
private var _startY:Number = 0;
private var _tension:Number = .5;
private var _decay:Number = .7;
private var _xSpeed:Number = 0;
private var _isDragging:Boolean = false;
private var _angle:int;
private var _radius:int = 50;
public function VirtualJoystick()
{
_startX = joystick.x;
_startY = joystick.y;
//add listeners
joystick.addEventListener(MouseEvent.MOUSE_DOWN,on_mouseDown);
stage.addEventListener(MouseEvent.MOUSE_UP,on_mouseUp);
stage.addEventListener(Event.ENTER_FRAME, on_enterFrame);
}
//---------------------o
// Mouse down handler
//---------------------o
protected function on_mouseDown(e:MouseEvent):void
{
_isDragging = true;
}
//---------------------o
// Mouse up handler
//---------------------o
protected function on_mouseUp(e:MouseEvent):void
{
_isDragging = false;
}
//---------------------o
// EnterFrame handler
//---------------------o
protected function on_enterFrame(e:Event):void
{
if( _isDragging )
{
_angle = Math.atan2(root.mouseY-_startY,root.mouseX-_startX)/(Math.PI/180);
joystick.rotation = _angle;
joystick.knob.rotation = -_angle;
joystick.knob.x = joystick.mouseX;
if( joystick.knob.x > _radius ){
joystick.knob.x = _radius;
}
//rotate player to match joystick direction
mcPlayer.rotation = _angle;
//keep player on screen
if( mcPlayer.y < 0 )
{
mcPlayer.y = 0;
}
if( mcPlayer.y > stage.stageHeight )
{
mcPlayer.y = stage.stageHeight;
}
if( mcPlayer.x < 0 )
{
mcPlayer.x = 0;
}
if( mcPlayer.x > stage.stageWidth )
{
mcPlayer.x = stage.stageWidth;
}
//move player proportionate to amount of joystick movement
mcPlayer.y += Math.sin(_angle*(Math.PI/180))*(joystick.knob.x/8);
mcPlayer.x += Math.cos(_angle*(Math.PI/180))*(joystick.knob.x/8);
}
else{
//Return joystick to neutral position when not touching
_xSpeed = -joystick.knob.x*_tension;
joystick.knob.x += _xSpeed;
}
}
}
}
UPDATE:
I have had a few people asking me for the FLA for this example, so here it is:
http://www.johnstejskal.com/blog-files/joystick.rar
I love you 🙂
I’m a bit confused as to what the difference is between joystick and joystick.knob. Some help would be appreciated!
Hi Jacob,
joystick is the whole component including the joystick backing plate and the ‘knob’ (movable circle)
knob is child of joystick and refers to the movable circle.
Let me know and I could send you an FLA with timeline code for you to play with
Thank u 🙂 useful
gonna be hard to run and jump without multitouch. thanks for dribble link though.
Hi John,
Cool joystick man. I am having some trouble and was wondering if you could send me the FLA file to mess around with a bit.
Hi John,
I was having some trouble with this and was wondering if you could send me the FLA file to mess around with.
Thanks you,
Jerome
Hi John, I am working in cs6 and I am having th hardest time implementing your joystick script into my existing game. Is there a way you could send me the fla file so I can get a better idea of how you put this together?
Any help would be so great, Thanks in advance!
Hello John, would appreciate if you can send the fla too, regards.
johnstejskal.com/blog-files/joystick.rar
I have now provided an FLA link for the example
johnstejskal.com/blog-files/joystick.rar
its a great tutorial… please send your fla in cs5 because im using flash cs5 and your fla detected as cs6 and it cannot open the file…
Is there any way that the knob can move from left to right only? Thanks. Your reply would be a great help.