Android Implement And Recognize Custom Gesture Example

Beside 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.

Follow below steps to create a custom gesture file.

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

2. Get The Custom Gesture File.

After create above custom gestures, the app will create a file which name is gesture.txt in the emulator to store the two gesture info. The file is saved in directory /storage/emulated/0/Android/data/pack.GestureApp. Although it has a txt suffix, but the file is a binary file in fact.

To get above gesture.txt file, please click Tools —> Android —> Android Device Monitor menu in android studio top menu bar.

android tools android device monitor

Select the android emulator in left panel, select File Explorer tab in right panel. If you find the storage or some directory can not be expanded, just follow below steps.

  1. Open a dos terminal window.
  2. Run adb root command, now you will get root permission of the emulator. You can open any directory.

explore custom android gesture store file in android device monitor

Now click the gesture.txt file and click Pull a file from device icon at top right corner of android device monitor to get the file to your PC.

READ :   Android Combine Custom And General Gestures Example

android device monitor pull file from device icon

3. Create Android App That Can Recognize Custom Gesture.

android implement and recognize custom gesture example release

3.1 Copy Gesture Store File Into Android Project.

Now you can use above gesture.txt file in your android application and make the application recognize the gestures saved in the file.

  1. Create a new android project in android studio.
  2. Right click app / res folder and click New —> Directory in the popup menu.
  3. Create a folder raw under app / res folder and copy gesture.txt file into it.
    android project app res raw gesture.txt

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 gesture.txt file.
  2. Create a class GesturePerformListener that implement 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, gesture overlay view widget will capture any gesture you performed and use the custom listener to response to it.
  5. Below is the project files structure of this example.
    android recognize custom gesture example project files

3.3 Main Activity Java File.

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.

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;

/**
 * Created by Administrator on 5/2/2018.
 */

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.

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>

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.