Android Implement And Recognize Custom Gesture Example

Besides default android gestures, you can also create your own custom gesture and recognize them in your android app. This article will tell you how to create custom gesture and how to recognize it in your android app.

1. Create Custom Gestures.

1. Follow the below steps to create a custom gesture file.
2. Download a gesture builder app such as Gesture Builder from the internet. You can also click here to get the apk file.
3. Then start an android emulator and drag and drop the gesture builder apk file into it to install.
4. After that, open the Gesture Builder app to add two custom gestures, one is named yes the other is named ok.
5. You can see the below demo video to learn how to do it.

If you can not watch the above video, you can see it on the youtube URL https://youtu.be/PMxRSUmImJw

2. Get The Custom Gesture File.

1. After creating the above custom gestures, the app will create a file which name is gesture.txt in the emulator to store the two gesture info.
2. The file is saved in directory /storage/emulated/0/Android/data/pack.GestureApp.
3. Although it has a .txt suffix, the file is a binary file in fact.
4. To get the above gesture.txt file, please click Tools —> Android —> Android Device Monitor menu in android studio top menu bar.
5. Select the android emulator in the left panel, select the File Explorer tab in the right panel. If you find the storage or some directory can not be expanded, just follow the below steps.
6. Open a dos terminal window.
7. Run adb root command, now you will get root permission of the emulator. You can open any directory.
8. Now click the gesture.txt file and click Pull a file from device icon at the top right corner of the android device monitor to get the file to your PC.

3. Create Android App That Can Recognize Custom Gestures.

If you can not watch the above video, you can see it on the youtube URL https://youtu.be/PsFw5GuzQ44

3.1 Copy Gesture Store File Into Android Project.

1. Now you can use the above gesture.txt file in your android application and make the application recognize the gestures saved in the file.
2. Create a new android project in android studio.
3. Right-click the app/res folder and click New —> Directory in the popup menu.
4. Create folder raw under the app/res folder and copy gesture.txt file into it.

3.2 How To Recognize Custom Gesture In Android Source Code.

1. Add a widget of android.gesture.GestureOverlayView class in layout XML file. This widget can capture user gestures and compare the gesture to predefined gestures saved in the gesture.txt file.
2. Create a class GesturePerformListener that implements GestureOverlayView.OnGesturePerformedListener interface, and override it’s onGesturePerformed method.
3. Create an instance of GesturePerformListener class just created and invoke GestureOverlayView‘s addOnGesturePerformedListener method to set it.
4. Then when you start the app, the gesture overlay view widget will capture any gesture you performed and use the custom listener to respond to it.
5. Below is the project files structure of this example.
   

3.3 Main Activity Java File.

1. MainActivity.java

   package com.dev2qa.android.example.customgesture;
   
   import android.content.Context;
   import android.gesture.GestureLibraries;
   import android.gesture.GestureLibrary;
   import android.gesture.GestureOverlayView;
   import android.support.v7.app.AlertDialog;
   import android.support.v7.app.AppCompatActivity;
   import android.os.Bundle;
   
   public class MainActivity extends AppCompatActivity {
   
       private GestureOverlayView gestureOverlayView = null;
   
       private GestureLibrary gestureLibrary = null;
   
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_main);
   
           setTitle("dev2qa.com - Android Custom Gesture Example.");
   
           Context context = getApplicationContext();
   
           init(context);
   
           GesturePerformListener gesturePerformListener = new GesturePerformListener(gestureLibrary);
   
           gestureOverlayView.addOnGesturePerformedListener(gesturePerformListener);
       }
   
       /* Initialise class or instance variables. */
       private void init(Context context)
       {
           if(gestureLibrary == null)
           {
               // Load custom gestures from gesture.txt file.
               gestureLibrary = GestureLibraries.fromRawResource(context, R.raw.gesture);
   
               if(!gestureLibrary.load())
               {
                   AlertDialog alertDialog = new AlertDialog.Builder(context).create();
                   alertDialog.setMessage("Custom gesture file load failed.");
                   alertDialog.show();
   
                   finish();
               }
           }
   
           if(gestureOverlayView == null)
           {
               gestureOverlayView = (GestureOverlayView)findViewById(R.id.gesture_overlay_view);
           }
       }
   }

3.4 Custom Gesture Perform Listener Java File.

1. GesturePerformListener.java

   package com.dev2qa.android.example.customgesture;
   
   import android.gesture.Gesture;
   import android.gesture.Prediction;
   import android.gesture.GestureLibrary;
   import android.gesture.GestureOverlayView;
   import android.support.constraint.solver.widgets.Snapshot;
   import android.widget.Toast;
   import android.support.design.widget.*;
   
   import java.util.ArrayList;
   
   public class GesturePerformListener implements GestureOverlayView.OnGesturePerformedListener {
   
       private GestureLibrary gestureLibrary = null;
   
       public GesturePerformListener(GestureLibrary gestureLibrary) {
           this.gestureLibrary = gestureLibrary;
       }
   
       /* When GestureOverlayView widget capture a user gesture it will run the code in this method.
          The first parameter is the GestureOverlayView object, the second parameter store user gesture information.*/
       @Override
       public void onGesturePerformed(GestureOverlayView gestureOverlayView, Gesture gesture) {
   
           // Recognize the gesture and return prediction list.
           ArrayList<Prediction> predictionList = gestureLibrary.recognize(gesture);
   
           int size = predictionList.size();
   
           if(size > 0)
           {
               StringBuffer messageBuffer = new StringBuffer();
   
               // Get the first prediction.
               Prediction firstPrediction = predictionList.get(0);
   
               /* Higher score higher gesture match. */
               if(firstPrediction.score > 5)
               {
                   String action = firstPrediction.name;
   
                   messageBuffer.append("Your gesture match " + action);
               }else
               {
                   messageBuffer.append("Your gesture do not match any predefined gestures.");
               }
   
               // Display a snackbar with related messages.
               Snackbar snackbar = Snackbar.make(gestureOverlayView, messageBuffer.toString(), Snackbar.LENGTH_LONG);
               snackbar.show();
           }
       }
   }

3.5 Layout XML File.

1. activity_main.xml

   <FrameLayout
       android:layout_width="match_parent"
       android:layout_height="match_parent">
   
       <android.gesture.GestureOverlayView
           android:id="@+id/gesture_overlay_view"
           android:layout_width="match_parent"
           android:layout_height="match_parent"
           android:layout_gravity="center"
           android:gestureColor="@color/colorPrimary"
           android:uncertainGestureColor="@color/colorPrimary"
           android:gestureStrokeType="multiple"/>
   </FrameLayout>