Membuat Class Swipe Gesture pada Aplikasi Android

Kata Gesture jika kita terjemahkan kedalam bahasa Indonesia berarti sikap atau langkah. Jika dikaitkan dengan interaksi sebuah aplikasi, Gesture berarti tindakan yang dilakukan oleh pemakai aplikasi agar mendapatkan feedback tertentu dari aplikasi yang bersangkutan. Feedback disini adalah balasan dari sistem yang bisa berupa perubahan sistem maupun keadaan sistem.

Pada smartphone yang memiliki basis sentuhan layar (touch screen), User saat ini sangat dimudahkan dalam hal pengaksesan fitur tertentu. Gesture pada smartphone dapat berupa sentuhan maupun usapan pada layar. Sedangkan beberapa teknologi OS mobile terbaru seperti Android, iPhone, Windows Phone maupun Blackberry dan OS lain dapat ditambahkan gesture yang dapat dienteraksikan pada aplikasi.

Salah satu bentuk interaksi yang dapat dilakukan user adalah melakukan Swipe layar. Pada aplikasi Android, developer dapat membuat sebuah Class atau fungsi tersendiri untuk membuat aplikasi dapat berganti ke Activity lain ketika user melakukan swipe. Di internet, penulis akhirnya menemukan Class Swipe gesture yang dapat dipasangkan dengan Class lain untuk membuat interaksi swipe layar.

Class TouchListener

Berikut adalah source code berbentuk Class Java Android Listener yang dapat pembaca pakai untuk membuat Swipe Gesture di Activity aplikasi Android :

package com.mkhuda.testing;

import android.view.GestureDetector;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;

public class OnSwipeTouchListener implements OnTouchListener {

    private final GestureDetector gestureDetector = new GestureDetector(new GestureListener());

    public boolean onTouch(final View view, final MotionEvent motionEvent) {
        return gestureDetector.onTouchEvent(motionEvent);
    }

    private final class GestureListener extends SimpleOnGestureListener {

        private static final int SWIPE_THRESHOLD = 100;
        private static final int SWIPE_VELOCITY_THRESHOLD = 100;

        @Override
        public boolean onDown(MotionEvent e) {
            return true;
        }

        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
            boolean result = false;
            try {
                float diffY = e2.getY() - e1.getY();
                float diffX = e2.getX() - e1.getX();
                if (Math.abs(diffX) > Math.abs(diffY)) {
                    if (Math.abs(diffX) > SWIPE_THRESHOLD && Math.abs(velocityX) > SWIPE_VELOCITY_THRESHOLD) {
                        if (diffX > 0) {
                            onSwipeRight();
                        } else {
                            onSwipeLeft();
                        }
                    }
                } else {
                    if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
                        if (diffY > 0) {
                            onSwipeBottom();
                        } else {
                            onSwipeTop();
                        }
                    }
                }
            } catch (Exception exception) {
                exception.printStackTrace();
            }
            return result;
        }
    }

    public void onSwipeRight() {
    }

    public void onSwipeLeft() {
    }

    public void onSwipeTop() {
    }

    public void onSwipeBottom() {
    }
}

Class diatas dapat pembaca simpan di antara Class Activity program Android. Seperti pada gambar berikut :

Cara Penggunaan

Untuk mengaplikasikannya, Buatlah class baru dengan nama sesuai Class di atas, yakni OnSwipeTouchListener. Class ini bisa kita panggil pada Activity lain dengan membuat menggunakan fungsi onTouchClickListener. Berikut adalah contohnya :

LinearLayout ln = (LinearLayout) findViewById(R.id.myLinear);
		        ln.setOnTouchListener(new OnSwipeTouchListener() {
		            public void onSwipeTop() {
                                // swipe ke atas
		            	Toast.makeText(ChalengeLinear.this, "Top", Toast.LENGTH_SHORT).show();
		            }
		            public void onSwipeRight() {
                                // swipe layar ke kanan
		            	onBackPressed();
		            }
		            public void onSwipeLeft() {
                                // swipe layar ke kiri
		            	Intent go = new Intent(MainActivity.this, ActivitySelanjutnya.class);
		                startActivity(go);

		            }
		            public void onSwipeBottom() {
                                // swipe layar ke bawah
		            	Toast.makeText(ChalengeLinear.this, "Bottom", Toast.LENGTH_SHORT).show();
		            }
		        });

Penjelasan kode :

1. Baris 3 – 6 merupakan fungsi yang akan menampilkan toast jika user melakukan swipe ke atas
2. Baris 7 – 9 merupakan fungsi jika layar di usap ke kanan. Return dari swipe ke kanan adalah BackKeyPressed, yang berarti kembali ke Activity sebelumnya.
3. Baris 11 – 16, jika user melakukan swipe ke kiri, maka akan melanjutkan ke Activity yang dituju. Menggunakan Intent/
4. Sedangkan baris 17 – 20, akan mengeluarkan toast jika user melakukan swipe ke bawah.
5. Jika pembaca hanya ingin mengaplikasikan swipe kanan kiri, pembaca cukup menghapus fungsi onSwipeBottom dan onSwipeTop.
6. Fungsi-fungsi di dalam masing-masing Swipe dapat pembaca implementasikan untuk interaksi lain, sesuai keinginan.

Pada source code di atas, ln merupakan pendefinisian dari LinearLayout sebuah Activity. Kemudian LinearLayout kita tambahkan fungsi setOnTouchListener dengan meng-include Class OnSwipeTouchListener di dalamnya (lihat baris nomor 2). Jika pada Activity pembaca berupa RelativeLayout. Pembaca hanya perlu mengganti LinearLayout dengan RelativeLayout.

RelativeLayout rl = (RelativeLayout) findViewById(R.id.myRelative);
       rl.setOnTouchListener(new OnSwipeTouchListener() {

       //tambahkan fungsi swipe	
       ....

});

Jika masih bingung, silahkan berikan komentar ! 🙂