[Android] Détection des Gestures

Cet article va traiter de la détection des Gestures sur une application Android.

Pour commencer qu’est-ce qu’une Gesture? C’est une forme que vous dessiné avec le doigt sur l’écran de votre Smartphone, par exemple une croix, un cercle,…

L’outil de base pour cet article est le GestureBuilderActivity présent dans les exemples du SDK d’Android : celui-ci va vous permettre de dessiner vos Gestures puis de les sauvegarder dans un fichier pour pouvoir les réutiliser dans votre application. Celui-ci sauvegarde les Gestures sur la carte SD, mais rien ne vous empêche de récupérer ce fichier pour l’intégrer en tant que ressource dans votre projet.

Tout d’abord pour commencer il vous faut rajouter un layout dans le fichier layout/main.xml. Ce layout devra être au dessus de tous les autres pour pouvoir écouter les évènements du doigt sur l’écran. Nous utiliserons donc le code suivant :

<android.gesture.GestureOverlayView
android:id="@+id/gestures"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1.0"
android:gestureColor="#00FFFFFF"
android:gestureStrokeType="multiple"
/>

Ceci permet de détecter les Gestures avec un ou plusieurs doigts, de laisser traverser les événements pour pouvoir réagir au click sur un élément situé sous le GestureOverlayView. La balise android:gestureColor permet de forcer la couleur en transparent, sinon un trait jaune suivra votre doigt tout au long de la Gesture.

Bon, on sait les dessiner, les écouter, il ne nous reste plus qu’à les traiter, ceci est vraiment simple :

public class GestureHandler implements OnGestureListener {
	private Activity appli = null;
	private GestureLibrary mLibrary;

	public GestureHandler(Activity app) {
		appli = app;
		File mStoreFile = new File(Environment.getExternalStorageDirectory(), "gestures");
		mLibrary = GestureLibraries.fromFile(mStoreFile);
		if (!mLibrary.load()) {
			appli.finish();
		}
	}

	@Override
	public void onGestureEnded(GestureOverlayView overlay, MotionEvent event) {
		ArrayList
 predictions = mLibrary.recognize(overlay.getGesture());
		// On veut au minimum une prédiction
		if (predictions.size() > 0) {
			Prediction prediction = predictions.get(0);
			// On veut que la prédiction soit sure
			if (prediction.score > 1.0) {
				Toast.makeText(appli, prediction.name, Toast.LENGTH_SHORT).show();
			}
		}
	}

	@Override
	public void onGesture(GestureOverlayView overlay, MotionEvent event) {}

	@Override
	public void onGestureCancelled(GestureOverlayView overlay, MotionEvent event) {}

	@Override
	public void onGestureStarted(GestureOverlayView overlay, MotionEvent event) {}	

}

Alors passons à l’explication : dans le constructeur nous générons la librairie des Gestures a partir du fichier Gestures présent sur la mémoire externe (carte SD), si ca ne se charge pas on quitte le programme.

Ici seul la méthode onGestureEnded nous intéresse, puisque l’on attend qu’une Gesture soit fini de dessiner à l’écran pour essayer de la reconnaître. Pour information une Gesture commence lorsqu’au moins un doigt est posé sur l’écran et que l’on commence à le bouger, et elle fini lorsque l’on enlève le doigt de l’écran. Rien ne nous empêche donc de mettre 20 secondes à dessiner notre Gestures.

La méthode onGestureEnded sera donc appelée dès qu’on aura relâché le doigt. La fonction mLibrary.recognize(overlay.getGesture()) nous permet de reconnaître la Gesture qui vient d’être tracé et de retourner un tableau de Gestures classé de celle qui ressemble le plus à celle qui ressemble le moins, toutes ces Gestures provenant de la librairie chargé plus tôt bien évidemment, si vous n’avez pas défini de Gestures vous n’aurais donc aucun résultat.

Le premier élément de la liste est donc celui qui ressemble le plus à ce que nous venons de dessiner, le soucis est que la fonction recognize peut nous retourner quelque chose même si rien ne ressemble de ce fait on rajoute la condition suivante if (prediction.score > 1.0) qui nous permet de nous assurer que le résultat est quand même relativement ressemblant à ce qu’on vient de tracer.

Pour finir la fonction Toast (très pratique par ailleurs), nous affiche une petite popup contenant le nom de la Gestures que la fonction vient de reconnaître.

Il ne nous reste plus qu’a relier le layout à la classe, on peut faire ceci dans la fonction onCreate de votre Activity principale :

		GestureOverlayView gestures = (GestureOverlayView) findViewById(R.id.gestures);
		GestureHandler gh = new GestureHandler(this);
		gestures.addOnGestureListener(gh);
Share and Enjoy:
  • Print
  • Facebook
  • Digg
  • Sphinn
  • del.icio.us
  • Mixx
  • Google Bookmarks
  • Add to favorites
  • MSN Reporter
  • MySpace

Tags: ,

Leave a Reply