How to detect swipe direction between left/right and up/down

烈酒焚心 提交于 2019-11-26 10:15:57
Ice Box

You simply have to extend SimpleOnGestureListener class,

Declare this in your class,

private static final int SWIPE_MIN_DISTANCE = 120;
private static final int SWIPE_MAX_OFF_PATH = 250;
private static final int SWIPE_THRESHOLD_VELOCITY = 200;

As an example for horizontal swipe you can see the below code,

 class MyGestureDetector extends SimpleOnGestureListener {
    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
            float velocityY) {
        try {
            if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH){
                return false;
            }
            // right to left swipe
            if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE
                    && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
                onLeftSwipe();
            } 
            // left to right swipe
            else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE
                    && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
                onRightSwipe();
            }
        } catch (Exception e) {

        }
        return false;
      }
   }

You can do this similarly for vertical swipe purpose.

I wrote a simple class for this: it's well documented so I wont explain it here

public class OnSwipeListener extends GestureDetector.SimpleOnGestureListener {

    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {

        // Grab two events located on the plane at e1=(x1, y1) and e2=(x2, y2)
        // Let e1 be the initial event
        // e2 can be located at 4 different positions, consider the following diagram
        // (Assume that lines are separated by 90 degrees.)
        //
        //
        //         \ A  /
        //          \  /
        //       D   e1   B
        //          /  \
        //         / C  \
        //
        // So if (x2,y2) falls in region:
        //  A => it's an UP swipe
        //  B => it's a RIGHT swipe
        //  C => it's a DOWN swipe
        //  D => it's a LEFT swipe
        //

        float x1 = e1.getX();
        float y1 = e1.getY();

        float x2 = e2.getX();
        float y2 = e2.getY();

        Direction direction = getDirection(x1,y1,x2,y2);
        return onSwipe(direction);
    }

    /** Override this method. The Direction enum will tell you how the user swiped. */
    public boolean onSwipe(Direction direction){
        return false;
    }

    /**
     * Given two points in the plane p1=(x1, x2) and p2=(y1, y1), this method
     * returns the direction that an arrow pointing from p1 to p2 would have.
     * @param x1 the x position of the first point
     * @param y1 the y position of the first point
     * @param x2 the x position of the second point
     * @param y2 the y position of the second point
     * @return the direction
     */
    public Direction getDirection(float x1, float y1, float x2, float y2){
        double angle = getAngle(x1, y1, x2, y2);
        return Direction.fromAngle(angle);
    }

    /**
     *
     * Finds the angle between two points in the plane (x1,y1) and (x2, y2)
     * The angle is measured with 0/360 being the X-axis to the right, angles
     * increase counter clockwise.
     *
     * @param x1 the x position of the first point
     * @param y1 the y position of the first point
     * @param x2 the x position of the second point
     * @param y2 the y position of the second point
     * @return the angle between two points
     */
    public double getAngle(float x1, float y1, float x2, float y2) {

        double rad = Math.atan2(y1-y2,x2-x1) + Math.PI;
        return (rad*180/Math.PI + 180)%360;
    }


    public enum Direction{
        up,
        down,
        left,
        right;

        /**
         * Returns a direction given an angle.
         * Directions are defined as follows:
         *
         * Up: [45, 135]
         * Right: [0,45] and [315, 360]
         * Down: [225, 315]
         * Left: [135, 225]
         *
         * @param angle an angle from 0 to 360 - e
         * @return the direction of an angle
         */
        public static Direction fromAngle(double angle){
            if(inRange(angle, 45, 135)){
                return Direction.up;
            }
            else if(inRange(angle, 0,45) || inRange(angle, 315, 360)){
                return Direction.right;
            }
            else if(inRange(angle, 225, 315)){
                return Direction.down;
            }
            else{
               return Direction.left;
           }

        }

       /**
         * @param angle an angle
         * @param init the initial bound
         * @param end the final bound
         * @return returns true if the given angle is in the interval [init, end).
         */
        private static boolean inRange(double angle, float init, float end){
            return (angle >= init) && (angle < end);
        }
    }
 }

To use simply extend the OnSwipeListener and override the onSwipe method

farhan patel

Fernandour answer is perfect, I am writing this answer about how to use it with Activity and Fragment as many people are looking for it.

public class MyActivity extends Activity implements View.OnTouchListener{

     private RelativeLayout someLayout;
     //take any layout on which you want your gesture listener;

     @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    gestureDetector=new GestureDetector(this,new OnSwipeListener(){

        @Override
        public boolean onSwipe(Direction direction) {
            if (direction==Direction.up){
               //do your stuff
                Log.d(TAG, "onSwipe: up");

            }

            if (direction==Direction.down){
               //do your stuff
                Log.d(TAG, "onSwipe: down");
            }
            return true;
        }


    });
    someLayout.setOnTouchListener(this);
}

    @Override
    public boolean onTouch(View v, MotionEvent event) {
      Log.d(TAG, "onTouch: ");
      gestureDetector.onTouchEvent(event);
      return true;
  }


}
Mercury

Giving a Usage Example for fernandohur answer above:

If you want to apply OnSwipeListener to one of your views, so:
Wherever this view is - set a touch listener for that view, like this:

myview.setOnTouchListener(this);

Now in your Activity's OnCreate or in your Custom view constructor do this:

// Global
private GestureDetectorCompat detector; 

// In OnCreate or custome view constructor (which extends one of Android views)
detector = new GestureDetectorCompat(context, onSwipeListener);

Override in the same class the onTouch event, like this:

@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
    return detector.onTouchEvent(motionEvent);
}

And also have in the same class this listener object:

OnSwipeListener onSwipeListener = new OnSwipeListener() {

@Override
public boolean onSwipe(Direction direction) {

    // Possible implementation 
    if(direction == Direction.left|| direction == Direction.right) {
        // Do something COOL like animation or whatever you want
        // Refer to your view if needed using a global reference
        return true;
    }
    else if(direction == Direction.up|| direction == Direction.down) {
        // Do something COOL like animation or whatever you want
        // Refer to your view if needed using a global reference
        return true;
    }

    return super.onSwipe(direction);
}

};

I solved this way:

viewPager.setOnTouchListener(new View.OnTouchListener() {
        float prevX = -1;

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if (prevX != -1) {
                if (event.getX() > prevX) {
                    if (viewPager.getCurrentItem() == 0) {
                         // Left to Right swipe
                    }
                    //Log.d("DEBUG", MotionEvent.ACTION_MOVE + ":" + event.getAction() + ":" + event.getActionMasked() + ":Left Swipe" + ":" + prevX + ":" + event.getX() + ":" + viewPager.getCurrentItem());
                } else if (prevX > event.getX()) {
                       // Right to left swipe
                    //Log.d("DEBUG", MotionEvent.ACTION_MOVE + ":" + event.getAction() + ":" + event.getActionMasked() + ":Right Swipe" + ":" + prevX + ":" + event.getX() + ":" + viewPager.getCurrentItem());
                }
            }
            if (event.getAction() == MotionEvent.ACTION_MOVE) {
                prevX = event.getX();
            } else {
                prevX = -1;
            }
            return false;
        }
    });

The answers available are far too complex for such a simple problem. I suggest another approach to it (code is as3, but you can get the idea):

var touchDistance:Number = Point.distance(_moveTouchPoint, _startTouchPoint);
if (touchDistance >= SWIPE_MIN_DISTANCE)
{
    var xDiff:Number = _moveTouchPoint.x - _startTouchPoint.x;
    var yDiff:Number = _moveTouchPoint.y - _startTouchPoint.y;

    var yGreater:Boolean = Math.abs(yDiff) >= Math.abs(xDiff);
    if (yGreater)
    {
        // direction is up or down
        changePlayerDirectionTo(yDiff < 0 ? DIRECTION_UP : DIRECTION_DOWN);
    }
    else
    {
        // direction is left or right
        changePlayerDirectionTo(xDiff < 0 ? DIRECTION_LEFT : DIRECTION_RIGHT)
    }
}

In each case either x or y will be greater in absolute value, which can resolve to certain direction set. From then on you can rely on the coordinate sign to detect which direction exactly.

You could override SimpleGestureListener and calculate the diff between start end current coordinates:

private class GestureListener extends SimpleOnGestureListener {

    @Override
    public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {

        if (e2.getY() > e1.getY()) {
            // direction up
        }else {
            // direction down
        }

        if (e2.getX() > e1.getX()) {
            // direction right
        }else {
            // direction left
        }

        return true;
    }
}

I have an open source gesture library on bitbucket that does this. Within this library is a 'HGFling' class. This demonstrates how to detect the direction of a fling. You can download the library from: https://bitbucket.org/warwick/hacergestov3. It's open source.

Adding Kotlin implementation for @Fernandour answer. For Java look at @farhan patel answer I am adding this because I was having difficulty, hope it will save someone#s time.

class ClientFragment : Fragment(), View.OnTouchListener {

    private lateinit var gestureDetector: GestureDetector

    override fun onTouch(v: View?, event: MotionEvent?): Boolean {
        Log.d(TAG, "onTouch: ");
        gestureDetector.onTouchEvent(event);
        return true
    }


override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {

 ...



 gestureDetector = GestureDetector(activity, object : OnSwipeListener() {

            override fun onSwipe(direction: Direction): Boolean {

                when(direction){
                   Direction.up ->
                   {
                       Log.d(TAG, "onSwipe: up")
                       sendCommand("UP")
                       return true
                   }
                     Direction.down ->{
                         Log.d(TAG, "onSwipe: down")
                         sendCommand("DOWN")
                         return true
                     }

                    Direction.left ->
                    {
                        Log.d(TAG, "onSwipe: left")
                        sendCommand("LEFT")
                        return true

                    }
                    Direction.right ->{
                        Log.d(TAG, "onSwipe: right")
                        sendCommand("RIGHT")
                        return true

                    }
                    else -> {
                    }
                }
                return true
            }


        })
        dpadLayout.setOnTouchListener(this)
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!