Postagens populares

quinta-feira, 8 de março de 2012

JoystickView - A custom Android View to simulates a Joystick in Android

JoystickView is an Android Custom View that simulates a joystick interactive applications for Android's Apps, as a simple objective, this view allows you to access the values ​​of ANGLE , POWER and DIRECTION of movements on virtual joystck.

Exhibition on a simple Android View


Quick Usage

1º Step: Download the JAR file at download
2º Step: Create a folder called "libs" on the root of your project and place the JAR file into.

It's enough to refer and user the JoystickView library

Advanced Usage

If you want to change or upgrade some feature of the library, you should do:

Go to the official project page on github JoystickView.

1º Step: Clone the project or download this project to your workspace eclipse IDE, then:

2º Step Go to eclipse' menu FILE, after IMPORT.

3º Step: Now click in "Existing Project into Workspace"

4º Step: Click in Browse e search the source code folder where you placed after clone ou download.

5º Step: Setup with Next or/and Finish, ant the JoystickView is ready to you use in your applications.

6º Step: IMPORT - JoystickView in your applications.

To use JoystickView in your applications, simply add the lib to the classpath of your application:

7º Passo: Click with right button on your project go to PROPERTIES -> ANDROID and the ADD.

8º Step: Select JoystickView lib and click OK to finish.


From this point you can inflate the JoystickView in your layouts or referencing it in your Activities.

This is an implementation of a custom android view that works like a Joystick, this view controls two variables, angle motion and power motion of the screen touch.

import com.zerokol.views.JoystickView;

import com.zerokol.views.JoystickView.OnJoystickMoveListener;
import android.os.Bundle;
import android.widget.TextView;

public class JoystickViewDemoActivity extends Activity {
     private TextView angleTextView;
     private TextView powerTextView;
     private TextView directionTextView;
     // Importing as others views
     private JoystickView joystick;

     public void onCreate(Bundle savedInstanceState) {

          angleTextView = (TextView) findViewById(;
          powerTextView = (TextView) findViewById(;
          directionTextView = (TextView) findViewById(;
          // referring as others views
          joystick = (JoystickView) findViewById(;

          // Listener of events, it'll return the angle in graus and power in percents
          // return to the direction of the moviment
          joystick.setOnJoystickMoveListener(new OnJoystickMoveListener() {
               public void onValueChanged(int angle, int power, int direction) {
                    angleTextView.setText(" " + String.valueOf(angle) + "°");
                    powerTextView.setText(" " + String.valueOf(power) + "%");
                    switch (direction) {
                         case JoystickView.FRONT:

                         case JoystickView.FRONT_RIGHT:

                         case JoystickView.RIGHT:

                         case JoystickView.RIGHT_BOTTOM:

                         case JoystickView.BOTTOM:

                         case JoystickView.BOTTOM_LEFT:

                         case JoystickView.LEFT:

                         case JoystickView.LEFT_FRONT:

          }, JoystickView.DEFAULT_LOOP_INTERVAL);

In your XML layout:


Creative Commons License

This work is licensed under a Creative Commons Attribution 3.0 Unported License.

12 comentários:

Florin Onciu disse...

what about the xml file ? what kind of view should be added in the xml to be referenced in the code ?

AJ O. Alves disse...

Thanks Florin Onciu, I updated the post to response your question!

Florin Onciu disse...

Hi again, I figure it out how to import it but it seems to work very slow. I don't know what's the cause. I also found another example here: but it slow as well. very slow. The joystick gets back in the original position after few seconds. Do you have any advice ?

AJ O. Alves disse...

Hey, this widget you found looks a lot like mine!!! very strange!!!

Well, about speed, this my project the update rate of the view is in every 100ms.

I got a advice! Try to import the project with source code, as a show in "Advanced Usage", then go to the JoystickView project and change the value of a variable called "DEFAULT_LOOP_INTERVAL", smaller value, greater will be the speed upgrade...

RUCHIT SHAH disse...

How to add in cocos2d example???

AJ O. Alves disse...

Hello Mr. Shah, Ruchid. I never used Cocos2D, but I guess you must to use just the class separated, copy it to any folder in your Cocos2D game project and use it like a simple java class.

Sathish R disse...

Nothing worked.. JoystickView is imported but stil app force closed.

AJ O. Alves disse...

Hello Sathish R.

Could you send me the output error, at Log Cat.

Ateeq Ahmed disse...

are you sure about the XML content ?? it doesnt seems to work! :/

AJ O. Alves disse...

Hello Mr Ahmed, yes, a lot of people used it! What is going wrong?

Enzo Maimone disse...
Este comentário foi removido pelo autor.
Anônimo disse...

I got the following error msg in Android Studio:

"Error parsing XML: not well-formed (invalid token)"

pointing to the line where the ""tag starts