Hey there. If you're reading this, it is likely you are looking for a Joystick solution for Starling. **Well you've found it!**. This Joystick offers features you'd expect from one, and it runs smoothly with the GPU Acceleration that Starling provides. To get started, you should:
- Download the files from the Repository.
- Extract the source files to 'starling/extensions/'
- Check the example project to see how to implement this Joystick.
import starling.extensions.advancedjoystick.JoyStick;
var myJoystick:Joystick = new Joystick();
myJoystick.setPosition(myJoystick.minOffsetX, clientHeight - myJoystick.minOffsetY);
addChild(myJoystick);
The above code would initialize the Joystick with the Default Skin. The Joystick will then be positioned at the
bottom left of the screen since minOffset
is the total size of the joystick, meaning that it will all be in the
screen. The Joystick is then added to the Starling Display List.
If we wanted to load a JoyStick with a Texture from a TextureAtlas
, then code similiar to the code below should
be used:
var holderTexture:Texture = myTextureAtlas.getTexture('joystick_holder');
var stickTexture:Texture = myTextureAtlas.getTexture('joystick_stick');
var myJoystick:JoyStick = new JoyStick( holderTexture, stickTexture, true );
This will load a JoyStick which is Custom Skinned. The last parameter is to set whether the JoyStick will start
working immediately. If you set this to false, the Joystick can be manually activated by calling activate()
.
Now, for getting the movement from the Joystick, this is also **very** simple. Let's use some simple code to move a simple object. Let's assume `player` is a Starling Sprite:
player.x += myJoystick.velocityX * maxSpeed;
player.y += myJoystick.velocityY * maxSpeed;
That's it. Run that code every frame and your object will move according to the Joystick. The values of velocityX
and
velocityY
are returned as normalized values, meaning that the value is between -1 and 1. This is for your benefit as
you can multiply this by a maximum value to move and object depending on the distance of the stick from the center of
the holder.
There are 3, more smaller functions that you should know. These are: - `activate();` - `deactivate();` - `changeSkin( holderTexture, stickTexture );`
These functions are pretty self-explanitory. If you deactivate the Joystick, touch will not work until it is activated.
The changeSkin()
accepts 2 Starling Textures. I recommend using a Texture Atlas as these are helpful with Memory in
larger games. There are plenty of tutorials elsewhere for that.
[Embed( source="skins/default_stick.png" )] private static const dsClassEmbed:Class;
public static const DEFAULT_STICK:Texture = Texture.fromBitmap( new dsClassEmbed() );
[Embed( source="skins/default_holder.png" )] private static const dhClassEmbed:Class;
public static const DEFAULT_HOLDER:Texture = Texture.fromBitmap( new dhClassEmbed() );>/code>