Reference


• Angles
• Sprite Arrange
• Changing sprites
• Child sprites
• Cloning sprites
• Collision detection
• Completion events
• Composition
• Coordinate space
• Data
• Drawing
• Expressions
• Flipbooks
• Joysticks
• Mouse events
• Movement
• Pursuits
• Range detection
• Reveal sprites
• Rotation
• Scaling and fading
• Shearing
• Sound
• Timing
• Touch events
• Variables

Joysticks

These examples only work on touch-enabled browsers.

A joystick object creates a virtual touch area of the screen which automatically tracks a user's touch movements. When you create a joystick you specify a center location for the stick. You may also provide a sprite that follows the user's touch movements.
Joysticks always spring back to center when the touch is ended.
The _joy variable can be accessed to find out current joystick information when the move event is fired (when the joystick moves). You can find details about _joy here.

Check out the dual joystick demo here.

Absolute Joysticks

Joysticks in absolute mode have a radius around their centers inside which touches are registered. Once a touch is detected within a joystick's radius, an event is fired for which are routine can read various joystick parameters. In absolute mode, joystick position values are relative to the center positions of the joystick. If the touch extends past the radius, then the joystick stops registering movement until the finger is slid back inside the radius or the touch is ended. (This may not be optimal, we are experimenting on this).
Note that _joy.x and _joy.y are always canvas x,y coordinates regarding of whether the joystick is relative or absolute.

create sprite from ball1.png as joysprite where center=25,25 end create joystick as joy1 where center=150,100 sprite=joysprite radius=100 move=OnMove mode=absolute end create routine as Start launch joy1 end create routine as OnMove draw onto _top clear fillstyle black font "normal normal 20px/2 sans-serif" filltext "x="+_joy.x,10,0,200 filltext "y="+_joy.y,10,20,200 filltext "angle="+_joy.angle,10,40,200 filltext "distance="+_joy.distance,10,60,200 filltext "percent="+_joy.percent,10,80,200 filltext "moved="+_joy.moved,10,100,200 filltext "direction="+_joy.direction,10,120,200 filltext "compass="+_joy.compass,10,140,200 enddraw end
editable

Relative Joysticks

In relative mode, the position values are relative to the last position of the joystick.
Joystick event values give position and angles of the joysticks position via a _joy variable.
Movement of the joystick sprite appears slightly choppy because, when in relative mode, touch movement must be at least 3 pixels to register. This prevents over-sensitivity and unintended directions. Usually the sprite won't be used on your joystick and the choppiness won't be noticed. For example, see this game. relative is the default.

create sprite from ball1.png as joysprite where center=25,25 end create joystick as joy1 where center=150,100 sprite=joysprite radius=100 mode=relative move=OnMove end create routine as Start launch joy1 end create routine as OnMove draw onto _top clear fillstyle black font "normal normal 20px/2 sans-serif" filltext "x="+_joy.x,10,0,200 filltext "y="+_joy.y,10,20,200 filltext "angle="+_joy.angle,10,40,200 filltext "distance="+_joy.distance,10,60,200 filltext "percent="+_joy.percent,10,80,200 filltext "moved="+_joy.moved,10,100,200 filltext "direction="+_joy.direction,10,120,200 filltext "compass="+_joy.compass,10,140,200 enddraw end
editable