Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android list view Right / Left swipes like call logs

I have an Android application in which there is List View Like this one

enter image description here

Now I want to perform two different activities on right/Left swipe of the List Items in the same way How native call log works

Right Swipe of list

enter image description here

I want this type of swipes. Can anyone know how to make it happen. Basically I wan to implement SimpleOnGestureListener.

I have read a post answered by sir gav Fling gesture detection on grid layout and after that I am successful in implementing left swipe and right swipe detection but the only thing I am not getting on which List Item the swipe has occurred.

Update 24 May 2013

Now I am able to detect swipe action using this code --

SwipeDetector.java

/**
 * Class swipe detection to View
 */
public class SwipeDetector implements View.OnTouchListener {

    public static enum Action {
        LR, // Left to right
        RL, // Right to left
        TB, // Top to bottom
        BT, // Bottom to top
        None // Action not found
    }

    private static final int HORIZONTAL_MIN_DISTANCE = 30; // The minimum
    // distance for
    // horizontal swipe
    private static final int VERTICAL_MIN_DISTANCE = 80; // The minimum distance
    // for vertical
    // swipe
    private float downX, downY, upX, upY; // Coordinates
    private Action mSwipeDetected = Action.None; // Last action

    public boolean swipeDetected() {
        return mSwipeDetected != Action.None;
    }

    public Action getAction() {
        return mSwipeDetected;
    }

    /**
     * Swipe detection
     */@Override
    public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            {
                downX = event.getX();
                downY = event.getY();
                mSwipeDetected = Action.None;
                return false; // allow other events like Click to be processed
            }
        case MotionEvent.ACTION_MOVE:
            {
                upX = event.getX();
                upY = event.getY();

                float deltaX = downX - upX;
                float deltaY = downY - upY;

                // horizontal swipe detection
                if (Math.abs(deltaX) > HORIZONTAL_MIN_DISTANCE) {
                    // left or right
                    if (deltaX < 0) {

                        mSwipeDetected = Action.LR;
                        return true;
                    }
                    if (deltaX > 0) {

                        mSwipeDetected = Action.RL;
                        return true;
                    }
                } else

                // vertical swipe detection
                if (Math.abs(deltaY) > VERTICAL_MIN_DISTANCE) {
                    // top or down
                    if (deltaY < 0) {

                        mSwipeDetected = Action.TB;
                        return false;
                    }
                    if (deltaY > 0) {

                        mSwipeDetected = Action.BT;
                        return false;
                    }
                }
                return true;
            }
        }
        return false;
    }

}

Now use it with your ListView in this fashion

    // Set the touch listener
    final SwipeDetector swipeDetector = new SwipeDetector();
    lv.setOnTouchListener(swipeDetector);

In your setOnItemClickListener you can detect the swipe events like these

lv.setOnItemClickListener(new OnItemClickListener() {


    @Override
    public void onItemClick(AdapterView <? > parent, View view,
        int position, long id) {

        if (swipeDetector.swipeDetected()) {
            if (swipeDetector.getAction() == SwipeDetector.Action.LR) {

                Toast.makeText(getApplicationContext(),
                    "Left to right", Toast.LENGTH_SHORT).show();

            }
            if (swipeDetector.getAction() == SwipeDetector.Action.RL) {

                Toast.makeText(getApplicationContext(),
                    "Right to left", Toast.LENGTH_SHORT).show();

            }
        }
    }
});

But still I am not able to animate the swipe like these:

enter image description here

like image 408
Nikhil Agrawal Avatar asked Apr 15 '13 14:04

Nikhil Agrawal


2 Answers

OnSwipeTouchListener.java:

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) {          super.onTouch(view, 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() {} } 

USAGE:

imageView.setOnTouchListener(new OnSwipeTouchListener() {      public void onSwipeTop() {         Toast.makeText(MyActivity.this, "top", Toast.LENGTH_SHORT).show();     }     public void onSwipeRight() {         Toast.makeText(MyActivity.this, "right", Toast.LENGTH_SHORT).show();     }     public void onSwipeLeft() {         Toast.makeText(MyActivity.this, "left", Toast.LENGTH_SHORT).show();     }     public void onSwipeBottom() {         Toast.makeText(MyActivity.this, "bottom", Toast.LENGTH_SHORT).show();     }  }); 
like image 177
Make it Simple Avatar answered Sep 25 '22 22:09

Make it Simple


you can use Fragments for this requirement. Use FragmentPagerAdapter and overide getItem(int position) which will return you the fragment. set the adapter to viewPager and in the setOnPageChangeListener you can have the logic for calling different fragment.

Shrishail

like image 1
shrishail_Android1490711 Avatar answered Oct 16 '22 21:10

shrishail_Android1490711