17 July 2015

Make a Gesture based android application

What we will do?
-> We will make an application which will close the app as we draw a big 'C' on the screen.

What we will need?
  • Emulator of android v1.3 or above with sdcard
  • gesture app in the emulator(present by default)
  • MainActivity.java (java class)
  • activity_main.xml (xml layout)
Step 1 : Create a new android application. Click on File ->New->Android Application Project.
file new android application

Step 2 : Give a name to your application as GestureDemo and package name as com.mia.gesturedemo. Then click Next continuously.
GestureDemo mia
Click Finish
finish

Step 3 : Code for activity_main.xml is given below.

 activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.gesture.GestureOverlayView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/gestures"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:eventsInterceptionEnabled="true"
android:gestureStrokeType="multiple"
android:orientation="vertical" >
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Make a 'C' to close" />
</android.gesture.GestureOverlayView>

Step 4 : Make a new folder named raw in res folder. Right-click on res->New->Folder.
res new folder raw

Step 5 : Open Android Virtual device Manager. Make a new Emulator or edit the previous emulator include sd card and give a size to it(any size). Click on OK.Then click Start.
new emulator with sd card

Step 6 : After you have started the emulator, click on Gestures Builder App.
Gestures Builder

Step 7 : Click on Add Gesture. Give a name to the gesture (close) and draw the gesture roughly (C) below it as shown in the screenshot.
add gesture


Step 8 : Click Done and you will see the name with the gesture as shown below.You can add other types of gestures too. Do not close the emulator.
gesture added

Step 9 : From the eclipse on the top right corner you will see the DDMS option, click on it. If not found, click on Open Perspective button on the left of Java,

9.a) There you will find DDMS.
9.b) Click on the emulator on left hand side.
9.c) Then click on File Explorer Tab as shown below.
9.d) You will find the gestures file in storage->sdcard->LOST_DIR folder. Click on it.
9.e) Now click on disk like icon on the top besides System Information(circled in red).
DDMS File Explorer storage

Step 10 : Go to the path of raw folder of your project. Then click Save.
path of raw folder

Step 11 : Refresh your project and you will see gestures file in raw folder in the Project Explorer.
gestures in raw folder

Step 12 : Add the below code in MainActivity.java.

MainActivity.java
package com.mia.gesturedemo;

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;

public class MainActivity extends Activity implements OnGesturePerformedListener {
GestureLibrary mLibrary;
@Override
public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  mLibrary = GestureLibraries.fromRawResource(this, R.raw.gestures);
  if (!mLibrary.load()) {
    finish();
   }
  GestureOverlayView gestures = (GestureOverlayView) findViewById(R.id.gestures);
  gestures.addOnGesturePerformedListener(this);
}

public void onGesturePerformed(GestureOverlayView overlay, Gesture gesture) {
  ArrayList<Prediction> predictions = mLibrary.recognize(gesture);
  if (predictions.size() > 0 && predictions.get(0).score > 1.0) {
    String result = predictions.get(0).name;
    if ("close".equalsIgnoreCase(result)) {
      finish();
    }
  }
}
}

Step 13 : Run your application.


Explanation of the code :

Explanation from MainActivity.java :
  • First we load the gestures made by the Gesture Builder application in mLibrary variable of type GestureLibrary. By putting an if condition we check if the gesture file exists or not. If it does not exist we will stop the application by using close() method.
mLibrary = GestureLibraries.fromRawResource(this, R.raw.gestures);
   if (!mLibrary.load()) {
     finish();
   }
  • Now we make gestures variable of type GestureOverlayView which is used to make the screen ready for gestures. We will call gestures by using addOnGesturePerformedListener() method.
GestureOverlayView gestures = (GestureOverlayView) findViewById(R.id.gestures);
gestures.addOnGesturePerformedListener(this);
  • Now the method onGesturePerformed() is used to perform operation on particular gesture. The ArrayList predictions hold the name of the gestures and gesture itself defined in gesture file.
public void onGesturePerformed(GestureOverlayView overlay, Gesture gesture) {
  ArrayList<Prediction> predictions = mLibrary.recognize(gesture);
  • Now we compare String "close" to name of element in predictions. If it is equal then we close the application using close().
if ("close".equalsIgnoreCase(result)) {
      finish();
   }
  • You can add other gestures by defining new gestures in Gesture Builder app and adding them in MainActivity class as else if condition below close option.
Github download
Stay tuned with Made In Android

Previous Page Next Page Home
Top