Home » Android

Implementing gestures in Android

In this article, we are going to implement gesture on image view to resize the image with finger touch in Android.
Submitted by Manu Jemini, on February 01, 2018

In the example below, we are going to use the View.ScaleGestureDetector class to make the image scaling. This method ScaleGestureDetector(this,new ScaleListener()) will return an object of ScaleGestureDetector class, which will be stored in the local variable. Another thing that we will need is the matrix to get the coordinated of the touch event on the screen. This matrix will go to be attached to the image later.

To implement this in your program you will need to import: android.view.MotionEvent, android.view.ScaleGestureDetector in your java file. Then create a layout file with a single ImageView like this.

<ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/image"
        android:src="@drawable/includehelp"
        android:scaleType="matrix"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="0dp"
        android:layout_marginRight="0dp"
        android:layout_alignParentEnd="true" />

Here, set the scale type of the image equal to the "matrix".

First, we will take the reference of the ImageView from the layout file, then create a new instance of the ScaleGestureDecter class and store it in the local variable.

Then we will override a listener ScaleGestureDetector.SimpleOnScaleGestureListener. This will listen for every touch event.

1) Java file:

package com.example.hp.myapplication;

import android.graphics.Matrix;
import android.graphics.Typeface;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.ScaleGestureDetector;
import android.widget.ImageView;
import android.widget.TextView;


public class MainActivity extends AppCompatActivity
{
    ImageView image;
    ScaleGestureDetector scale_g_detector;
    Matrix m = new Matrix();
    float s = 0.2f;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        image=(ImageView)findViewById(R.id.image);
        scale_g_detector = new ScaleGestureDetector(this,new ScaleListener());
    }

    public boolean onTouchEvent(MotionEvent me) {
        scale_g_detector.onTouchEvent(me);
        return true;
    }

    private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener
    {
        @Override
        public boolean onScale(ScaleGestureDetector d)
        {
            s *= d.getScaleFactor();
            s = Math.max(0.2f, Math.min(s, 3.0f));
            m.setScale(s, s);
            image.setImageMatrix(m);
            return true;
        }
    }
}

2) XML file:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.hp.myapplication.MainActivity">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/image"
        android:src="@drawable/includehelp"
        android:scaleType="matrix"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="0dp"
        android:layout_marginRight="0dp"
        android:layout_alignParentEnd="true" />

</RelativeLayout>

3) Manifest file:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.hp.myapplication">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

Output