Implement Gestures In Android Apps

Introduction

Android is one of the most popular operating systems for mobile. Nowadays, gestures are an important element of Android apps. Gestures make it easy to access the apps and makes things convenient for the user.

In this article, I will show you how to implement gestures in Android applications using Android Studio. Android is a kernel based operating system. In Android, users can modify the GUI components and source code.

Requirements

  • Android Studio
  • A little knowledge of XML and JAVA 
  • Android Emulator (or) Android mobile

Steps to be followed

Carefully follow my steps to implement gestures in Android applications using Android Studio. I have included the source code too.

Step 1

Open Android Studio and start a new project.

Android

Step 2

Put the application name and company domain. If you wish to use C++ for coding this project, mark the "Include C++ support" checkbox and click Next.

Android

Step 3

Select the Android minimum SDK and click Next.

Android

Step 4

Choose "Basic Activity" and click Next.

Android

Step 5

Put the activity name and layout name. Android Studio basically takes Java class nameas  what you provide for activity name. Now, click Finish.

Android

Step 6

Go to activity_main.xml and click the text botton. This xml file contains the designing code for Android app. In the activity_main.xml file, copy and paste the below code.

Activity_main.xml code

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     xmlns:app="http://schemas.android.com/apk/res-auto"  
  4.     xmlns:tools="http://schemas.android.com/tools"  
  5.     android:layout_width="match_parent"  
  6.     android:layout_height="match_parent"  
  7.     tools:context="ganeshannt.gesturesample.MainActivity">  
  8.   
  9.   
  10.     <TextView  
  11.         android:id="@+id/ganimsg"  
  12.         android:layout_width="wrap_content"  
  13.         android:layout_height="wrap_content"  
  14.         android:layout_alignParentTop="true"  
  15.         android:layout_centerHorizontal="true"  
  16.         android:layout_marginTop="230dp"  
  17.         android:text="TextView"  
  18.         android:textAppearance="@style/TextAppearance.AppCompat.Body2" />  
  19. </RelativeLayout>  

User interface

Android

Step 7

In the MainActivity.java file, copy and paste the below code. Java is back-end language for Android. Do not replace your package name otherwise the app will not run.

MainActivity.java code

  1. package ganeshannt.gesturesample;  
  2.   
  3. import android.support.v7.app.ActionBarActivity;  
  4. import android.os.Bundle;  
  5. import android.view.Menu;  
  6. import android.view.MenuItem;  
  7. import android.widget.TextView;  
  8. import android.view.MotionEvent;  
  9. import android.view.GestureDetector;  
  10. import android.support.v4.view.GestureDetectorCompat;  
  11.   
  12.   
  13. public class MainActivity extends ActionBarActivity implements GestureDetector.OnGestureListener,  
  14.         GestureDetector.OnDoubleTapListener {  
  15.     private TextView ganeshMessage;  
  16.     private GestureDetectorCompat gestureDetector;  
  17.   
  18.     @Override  
  19.     protected void onCreate(Bundle savedInstanceState) {  
  20.         super.onCreate(savedInstanceState);  
  21.         setContentView(R.layout.activity_main);  
  22.   
  23.         ganeshMessage = (TextView) findViewById(R.id.ganimsg);  
  24.         this.gestureDetector = new GestureDetectorCompat(thisthis);  
  25.         gestureDetector.setOnDoubleTapListener(this);  
  26.     }  
  27.   
  28.     ///////// GESTURE METHODS //////////  
  29.     @Override  
  30.     public boolean onSingleTapConfirmed(MotionEvent e) {  
  31.         ganeshMessage.setText("onSingleTapConfirmed");  
  32.         return true;  
  33.     }  
  34.   
  35.     @Override  
  36.     public boolean onDoubleTap(MotionEvent e) {  
  37.         ganeshMessage.setText("onDoubleTap");  
  38.         return true;  
  39.     }  
  40.   
  41.     @Override  
  42.     public boolean onDoubleTapEvent(MotionEvent e) {  
  43.         ganeshMessage.setText("onDoubleTapEvent");  
  44.         return true;  
  45.     }  
  46.   
  47.     @Override  
  48.     public boolean onDown(MotionEvent e) {  
  49.         ganeshMessage.setText("onDown");  
  50.         return true;  
  51.     }  
  52.   
  53.     @Override  
  54.     public void onShowPress(MotionEvent e) {  
  55.         ganeshMessage.setText("onShowPress");  
  56.   
  57.     }  
  58.   
  59.     @Override  
  60.     public boolean onSingleTapUp(MotionEvent e) {  
  61.         ganeshMessage.setText("onSingleTapUp");  
  62.         return true;  
  63.     }  
  64.   
  65.     @Override  
  66.     public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {  
  67.         ganeshMessage.setText("onScroll");  
  68.         return true;  
  69.     }  
  70.   
  71.     @Override  
  72.     public void onLongPress(MotionEvent e) {  
  73.         ganeshMessage.setText("onLongPress");  
  74.   
  75.     }  
  76.   
  77.     @Override  
  78.     public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {  
  79.         ganeshMessage.setText("onFling");  
  80.         return true;  
  81.     }  
  82.   
  83.     ///////// GESTURE METHODS //////////  
  84.   
  85.   
  86.     @Override  
  87.     public boolean onTouchEvent(MotionEvent event) {  
  88.         this.gestureDetector.onTouchEvent(event);  
  89.         return super.onTouchEvent(event);  
  90.     }  
  91.   
  92.     @Override  
  93.     public boolean onCreateOptionsMenu(Menu menu) {  
  94.         // Inflate the menu; this adds items to the action bar if it is present.  
  95.         getMenuInflater().inflate(R.menu.menu_main, menu);  
  96.         return true;  
  97.     }  
  98.   
  99.     @Override  
  100.     public boolean onOptionsItemSelected(MenuItem item) {  
  101.         // Handle action bar item clicks here. The action bar will  
  102.         // automatically handle clicks on the Home/Up button, so long  
  103.         // as you specify a parent activity in AndroidManifest.xml.  
  104.         int id = item.getItemId();  
  105.   
  106.         //noinspection SimplifiableIfStatement  
  107.         if (id == R.id.action_settings) {  
  108.             return true;  
  109.         }  
  110.   
  111.         return super.onOptionsItemSelected(item);  
  112.     }  
  113. }  
Step 8

As we need to perform each java activity change in AndroidManifest, add the below code in AndroidManifest.xml file. 

AndroidManifest.xml code
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <manifest xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     package="ganeshannt.gesturesample">  
  4.   
  5.     <application  
  6.         android:allowBackup="true"  
  7.         android:icon="@mipmap/ic_launcher"  
  8.         android:label="@string/app_name"  
  9.         android:roundIcon="@mipmap/ic_launcher_round"  
  10.         android:supportsRtl="true"  
  11.         android:theme="@style/AppTheme">  
  12.         <activity android:name=".MainActivity">  
  13.             <intent-filter>  
  14.                 <action android:name="android.intent.action.MAIN" />  
  15.   
  16.                 <category android:name="android.intent.category.LAUNCHER" />  
  17.             </intent-filter>  
  18.         </activity>  
  19.     </application>  
  20.   
  21. </manifest>  
Step 9

This is our user interface of the application. Click the "Make Project" option.

Android

Step 10

Run the application >> select virtual machine >> click OK.

Android

Deliverables

Here, we have successfully implemented gestures in an Android application.

Android

Android

Android


Android

Don’t forgot to like and follow me. If you have any doubts, just comment below.

Source code - https://github.com/GaneshanNT/GestureSample