«
»

Creating a simple Gesture App with Android

May 14th, 2010 by

The integration of gestures into your android app adds some nice functionality and is made very easy using Google’s GestureBuilder application and the integrated GestureLibrary and Gesture Overlay API – so let’s build a sample app.

If you need some basic information regarding gestures on android first – take a look at this article.

Contents

  1. Creating a gesture library
  2. Capturing Gestures
  3. Testing the Gesture
  4. Resources
  5. Article Updates
 

Creating a gesture library

First you need to define the gestures that should be captured in the application later. For this reason there’s the GestureBuilder delivered with the Android SDK. You can find the app in the samples directory of your android sdk – e.g. <installation-directory>/android-sdk-linux_86/platforms/android-2.1/samples/GestureBuilder.

Run the gesture builder app on the android emulator. It is important to run the app with a SD card connected – if you need more information on creating virtual SD cards – take a look at this article. The important thing is to start the emulator with -sdcard <path-to-virtual-sdcard>/<sdcard-image>. The app needs the sdcard to store the captured gestures on it.

Running the GestureBuilder you need to add a new gesture – for this tutorial I’m capturing one gesture by drawing a spiral and naming it to “test”.

Copy the gesture library from the SD card  – e.g. by opening the view Android File Explorer in Eclipse  and save it somewhere for now.

Capturing Gestures

First create a new android application using the android sdk – my AndroidManifest.xml looks like this

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
 package="com.hascode.android.tutorial"
 android:versionCode="1"
 android:versionName="1.0">
 <application android:icon="@drawable/icon" android:label="@string/app_name">
 <activity android:name=".GestureActivity"
 android:label="@string/app_name">
 <intent-filter>
 <action android:name="android.intent.action.MAIN" />
 <category android:name="android.intent.category.LAUNCHER" />
 </intent-filter>
 </activity>
 </application>
</manifest>

My strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">hasCode.com - Gesture Tutorial</string>
</resources>

Create directory res/raw if it doesn’t exist yet and put the downloaded gesture library “gesture” in there

Now create an activity called GestureActivity and reference the gesture library – my class looks like this

package com.hascode.android.tutorial;
 
import java.util.ArrayList;
 
import android.app.Activity;
import android.gesture.Gesture;
import android.gesture.GestureLibraries;
import android.gesture.GestureLibrary;
import android.os.Bundle;
import android.util.Log;
 
/**
 * A simple Activity listening for Gestures
 *
 * visit https://www.hascode.com
 */
public class GestureActivity extends Activity {
	private GestureLibrary gLib;
	private static final String TAG = "com.hascode.android.gesture";
 
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
 
		gLib = GestureLibraries.fromRawResource(this, R.raw.gesture);
		if (!gLib.load()) {
			Log.w(TAG, "could not load gesture library");
			finish();
		}
	}
}

Now we need a gesture overlay – we’re adding it to the main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<TextView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="Try to draw the gesture"
    />
<android.gesture.GestureOverlayView
    android:id="@+id/gestures"
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1.0" />
</LinearLayout>

Add an event listener to the activity and reference the gesture overlay in the GestureActivity – at last my class looks like this:

package com.hascode.android.tutorial;
 
import java.util.ArrayList;
 
import android.app.Activity;
import android.gesture.Gesture;
import android.gesture.GestureLibraries;
import android.gesture.GestureLibrary;
import android.gesture.GestureOverlayView;
import android.gesture.Prediction;
import android.gesture.GestureOverlayView.OnGesturePerformedListener;
import android.os.Bundle;
import android.util.Log;
import android.widget.Toast;
 
/**
 * A simple Activity listening for Gestures
 *
 * visit https://www.hascode.com
 */
public class GestureActivity extends Activity {
	private GestureLibrary gLib;
	private static final String TAG = "com.hascode.android.gesture";
 
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
 
		gLib = GestureLibraries.fromRawResource(this, R.raw.gesture);
		if (!gLib.load()) {
			Log.w(TAG, "could not load gesture library");
			finish();
		}
 
		GestureOverlayView gestures = (GestureOverlayView) findViewById(R.id.gestures);
		gestures.addOnGesturePerformedListener(handleGestureListener);
	}
 
	/**
	 * our gesture listener
	 */
	private OnGesturePerformedListener handleGestureListener = new OnGesturePerformedListener() {
		@Override
		public void onGesturePerformed(GestureOverlayView gestureView,
				Gesture gesture) {
 
			ArrayList<Prediction> predictions = gLib.recognize(gesture);
 
			// one prediction needed
			if (predictions.size() > 0) {
				Prediction prediction = predictions.get(0);
				// checking prediction
				if (prediction.score > 1.0) {
					// and action
					Toast.makeText(GestureActivity.this, prediction.name,
							Toast.LENGTH_SHORT).show();
				}
			}
 
		}
	};
}

Testing the Gesture

Now run the application and draw the spiral and a toast showing the gesture’s name (I named it “test”) pops up:

Resources

Article Updates
  • 2015-03-03: Table of contents added.
    <?xml version=”1.0″ encoding=”utf-8″?>
    <manifest xmlns:android=”http://schemas.android.com/apk/res/android” package=”com.hascode.android.tutorial” android:versionCode=”1″ android:versionName=”1.0″>
    <application android:icon=”@drawable/icon” android:label=”@string/app_name”>
    <activity android:name=”.GestureActivity” android:label=”@string/app_name”>
    <intent-filter>
    <action android:name=”android.intent.action.MAIN” />
    <category android:name=”android.intent.category.LAUNCHER” />
    </intent-filter>
    </activity>
    </application>
    </manifest>

    Tags: , , , , , , , , ,

    This entry was posted on Friday, May 14th, 2010 at 6:25 am and is filed under Android. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.

    14 Responses to “Creating a simple Gesture App with Android”

    1. Naveen shrivastva Says:
      January 7th, 2011 at 5:03 am

      how to save gesture in sd card

    2. micha kops Says:
      January 7th, 2011 at 8:14 am

      from the emulator? or an app on your smartphone?

    3. rahul Says:
      April 12th, 2011 at 12:23 pm

      Can you tell me how these Gestures are saved in the SD card. I mean the piece of code which does it.?

    4. micha kops Says:
      April 12th, 2011 at 5:56 pm

      You can find the sources for the gesture builder in your android install dir in “platforms/android-/samples/GestureBuilder/” – take a look at GestureBuilderActivity in “src/com/android/gesture/builder”

      the following code could work, too ;)

      final GestureLibrary lib = GestureLibraries.fromFile(new File(Environment.getExternalStorageDirectory(), "mygestures"));
      lib.addGesture("gesture's name", gesture); // adding
      lib.remove(gesture); // removing
      lib.save(); // done

    5. Lalita Says:
      October 20th, 2011 at 3:33 am

      I’m a newbie and hope you guys could bear with me.
      Thanks for the awesome stuffs. It truly helps a lot.
      The thing is……
      I try to run this code, but encountered one problem.
      The error message is “raw cannot be resolved or is not a field”
      in this line “gLib = GestureLibraries.fromRawResource(this, R.raw.gesture);”

      Could anyone here light me up?
      Thank you in advance!!

    6. micha kops Says:
      October 20th, 2011 at 1:37 pm

      hi there!
      did you create the directory “res/raw” and did you copy your captured gesture library named “gesture” to this directory as described above?

    7. sandeep goria Says:
      November 18th, 2011 at 12:50 pm

      I have added the gesture overlay in a linear layout with a imageView and a gessture overlay. It is not detecting in Android 2.2 but working fine Android 3.0 Please suggest necessary solution.

    8. Riz Says:
      January 4th, 2012 at 8:50 am

      i want to recognize the gesture when user click on the button.

    9. Anuja Says:
      March 8th, 2012 at 10:51 am

      Is there any good answer to this Stackoverflow question related to Gesture?

    10. Anuja Says:
      March 8th, 2012 at 10:53 am

      Is there any good answer to this Stackoverflow question related to Gesture?

      http://stackoverflow.com/q/9120499/833007

      (Sorry previous comment does not have the link)

    11. micha kops Says:
      March 11th, 2012 at 8:44 pm

      I haven’t seen a complete gesture library that contained everything I needed yet .. once I wanted to implement and share a gesture library covering the basic printable ASCII characters as gestures + detection and listener API but there’s not much progress atm

    12. C-Swipe: An Ergonomic Solution To Navigation Fragmentation On Android | Smashing Magazine Says:
      April 16th, 2014 at 12:55 pm

      [...] the GestureBuilder delivered with the Android SDK. You can read about this detailed procedure in “Creating a Simple Gesture App With Android” by Micha [...]

    13. Davor Says:
      May 12th, 2015 at 6:03 am

      When I try to run it I get different errors. Could this be because this is for the Android 2.1 version and I’m working on 5 Lollipop? I’m just a beginner, sorry for stupid questions

    14. micha kops Says:
      May 12th, 2015 at 6:53 pm

      Hi Davor,

      what error occurs when running the examples with lollipop in your environment?

      Greets

      Micha

    Recent Articles
    Search
    Archive
    Tags
    Categories
    Links