How do you rate this blog

Sunday, December 18, 2011

Creating Simple Gestures


Gestures are mainly useful in touch screens. Instead of users clicking on the menu and performing actions they can use gestures to perform the same. A gesture can be used to perform actions like add, delete, update etc.
In this post I have used to gestures to display alert dialogues. For this you need to add gestures using the GestureBuilder. The GestureBuilder is available in your emulators. Make sure that your emulator has SD card configured.
If you need to add SD Card into the emulator –
Step1 – Open command prompt go the folder where the android-sdk is located and go to tools and use the below command
“mksdcard 256M <path>\<filename>.iso“
you can vary the size of the SD card based on your needs.
Step2 - Now open the AVD manager, click on the AVD for which you want to add the SD card and click on edit.
Step 4 - Now make the SD card point to the iso file created in the step above.
Open the GestureBuilder app in the emulator and create your own gestures as shown below.



Now that you have added the Gestures you need to copy it to the local environment and add it to the solution since it will be used in the GestureOverlayView.
You can copy the data from the sdcard by –
Step 1 – Start the emulator.
Step2 – open command prompt and go to the <anroid-sdk location>/platform-tools and use the below command
Adb pull /sdcard/gestures <folder on your local environment>

Now create a new project. Then create a new folder called ‘raw’ under ‘res’. Then open ‘main.xml’ file under layouts and remove the default text box. Now add the GestureOverlayView and match its width and height with that of the parent.

Now go to the main java file, you will notice it extends Activity by default. Since we also need gestures we have to implement OnGesturePerformedListener as well. Once you do that you can see it suggests you to implement onGesturePerformed as well. This function is required since we will define the actions based on the gestures which are available.
Before defining actions we need to define GestureOverlayView and bind it to the control which we have defined in the ‘main.xml’ and add function which will read the gesture performed.
GestureOverlayView gov=(GestureOverlayView) findViewById(R.id.gestureOverlayView1);
gov.addOnGesturePerformedListener(this);
Now we need to define the Gesture library and include the gestures we had created earlier.
gl=GestureLibraries.fromRawResource(this, R.raw.gestures);
if(!gl.load()){
  finish();
}

Now we need to define the action when the gesture is performed and this is done inside onGesturePerformed.
Here you need to create an arraylist which will store all the gestures. Then we need to see if the gesture has matched a certain gesture in the library. If the score is above 1 then it’s a pretty good one else its considered poor. Hence we will consider only those gestures which have score greater than 1 and create an alert dialog with the name of the gesture.
public void onGesturePerformed(GestureOverlayView overlay, Gesture gesture) {                        
ArrayList<Prediction> pred=gl.recognize(gesture);         
for(Prediction p:pred){
if(p.score > 1.0){
AlertDialog.Builder ab=new AlertDialog.Builder(GesturesDemoActivity.this);
ab.setTitle("Gesture Demo");
ab.setMessage("You used the gesture"+p.name);
ab.setPositiveButton("OK",null);
ab.show();
                }
}
The code will look like the snapshot shown below


Now run the project in the simulator. Once the app starts running, write a gesture which you have created earlier as shown below.



When you release the touch from the screen you can see an alert dialog appears with the name of the gesture on it.


1 comment:

  1. This is Google Gestures. You mastered that too. Awesome buddy.!

    ReplyDelete