Support free tutorials









vogella training Training Books



Android Gestures - Tutorial

Lars Vogel

Version 0.1

04.01.2011

Android Gestures

This tutorial describes how to use Gestures and the GestureOverylayVIew in Android. The tutorial is based on Eclipse 3.6, Java 1.6 and Android 2.3 (Gingerbread).


Table of Contents

1. Android Gestures
2. Example
3. Support this website
3.1. Thank you
3.2. Questions and Discussion
4. Links and Literature
4.1. Source Code
4.2. Android Resources
4.3. vogella Resources

1. Android Gestures

Android supports gestures. To use this support your application must use the view "GestureOverlayView". In this view you place your other views.

Gestures are defined by a binary resources which can be created with an example program from the Android SDK. In your activity you can load Gestures via GestureLib.fromRawResource(). If a gesture is detected then the method "onGesturePerformedListener" is called. For this the activity must implement the interface "OnGesturePerformedListener" and must register itself at the GestureOverlayView with the method "addOnGesturePerformedListener()".

Android shows the gestures in yellow for recognized gestures and a ligher yellow for not recognized gestures. You can turn this off, via setGestureColor(Color.TRANSPARENT) or setUncertainGestureColor(Color.TRANSPARENT) on the GestureOverlayView.

If you create the gesture in the Android simulator via the program "GestureBuilder". You can create several gestures with the same name. That may help you to determine the right one. If you create an Android Emulator for Android 1.6 this application will be preinstalled on your device. Make sure to create a device with sdcard otherwise you cannot save gestures. All gestures will be saved in a file called gestures on your emulator.

You can copy the gestures from the emulator via the adb onto your local machine via the command:

./adb pull /sdcard/gestures ~/test 

The gesture file must be copied into your application under "res/raw". Afterwards it can be used in your GestureOverlayView.

2. Example

Create a new Android project "de.vogella.android.gestures" with the activity "GestureTest". Create a few gestures and copy them to your application as described in the last chapter.

Unfortunately the UI builder does not support GestureOverlayView, please see Bug report GestureOverlayView not working in the layout builder, therefore we have to build a layout without the gesture view and add this view via code to the GestureOverlayView.

Create the following layout 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="match_parent"
    android:layout_height="match_parent"
    >
<TextView  
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:text="@string/hello"/>
</LinearLayout> 

Create the following Activity.

package de.vogella.android.gestures;

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.GestureOverlayView.OnGesturePerformedListener;
import android.gesture.Prediction;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;

public class GestureTest extends Activity implements OnGesturePerformedListener {
  private GestureLibrary gestureLib;

  
/** Called when the activity is first created. */
@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); GestureOverlayView gestureOverlayView = new GestureOverlayView(this); View inflate = getLayoutInflater().inflate(R.layout.main, null); gestureOverlayView.addView(inflate); gestureOverlayView.addOnGesturePerformedListener(this); gestureLib = GestureLibraries.fromRawResource(this, R.raw.gestures); if (!gestureLib.load()) { finish(); } setContentView(gestureOverlayView); } @Override public void onGesturePerformed(GestureOverlayView overlay, Gesture gesture) { ArrayList<Prediction> predictions = gestureLib.recognize(gesture); for (Prediction prediction : predictions) { if (prediction.score > 1.0) { Toast.makeText(this, prediction.name, Toast.LENGTH_SHORT) .show(); } } } }

Start your application. As a result you should be able to perform gestures and see the result. We only show a Toast but of course you could perform all kind of actions.

3. Support this website

This tutorial is Open Content under the CC BY-NC-SA 3.0 DE license. Source code in this tutorial is distributed under the Eclipse Public License. See the vogella License page for details on the terms of reuse.

Writing and updating these tutorials is a lot of work. If this free community service was helpful, you can support the cause by giving a tip as well as reporting typos and factual errors.

3.1. Thank you

Please consider a contribution if this article helped you. It will help to maintain our content and our Open Source activities.

3.2. Questions and Discussion

If you find errors in this tutorial, please notify me (see the top of the page). Please note that due to the high volume of feedback I receive, I cannot answer questions to your implementation. Ensure you have read the vogella FAQ as I don't respond to questions already answered there.

4. Links and Literature

4.1. Source Code

Source Code of Examples

4.3. vogella Resources

vogella Training Android and Eclipse Training from the vogella team

Android Tutorial Introduction to Android Programming

GWT Tutorial Program in Java, compile to JavaScript and HTML

Eclipse RCP Tutorial Create native applications in Java

JUnit Tutorial Test your application

Git Tutorial Put all your files in a distributed version control system