[原创] 如何在android中实现swipe的手势功能及页面拖动动画

iPhone界面解锁是用手指划动来实现的, 那么这个手势gesture在android里如何实现呢?

Android SDK提供了一个listener类来侦测各种不同的手势:
SimpleOnGestureListener.  你只需要实现自己所关心的手势就可以了.
Swipe在android里面是叫Fling ^_^

首先创建自己的一个手势detector类:

class MyGestureDetector extends SimpleOnGestureListener {
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
}

一个划动的手势有几个特征, 比如是在x或者y轴上近乎直线的划动, 中途路径的偏差不能太大, 而且划动需要一定的速度, 所以我们定义几个定量:

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;

然后在onFling方法中, 判断是不是一个合理的swipe动作:

if(e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
viewFlipper.setInAnimation(slideLeftIn);
viewFlipper.setOutAnimation(slideLeftOut);
viewFlipper.showNext();
} else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
viewFlipper.setInAnimation(slideRightIn);
viewFlipper.setOutAnimation(slideRightOut);
viewFlipper.showPrevious();
}

这里的viewFlipper是含有多个view的一个container, 可以很方便的调用prev/next view, 加上animation动画, 可以达到一些不错的效果:

viewFlipper = (ViewFlipper)findViewById(R.id.flipper);
        slideLeftIn = AnimationUtils.loadAnimation(this, R.anim.slide_left_in);
        slideLeftOut = AnimationUtils.loadAnimation(this, R.anim.slide_left_out);
        slideRightIn = AnimationUtils.loadAnimation(this, R.anim.slide_right_in);
        slideRightOut = AnimationUtils.loadAnimation(this, R.anim.slide_right_out);

自定义的animation可以查看具体的XML, 比如从左边进来的一个动画:

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="100%p" android:toXDelta="0" android:duration="800"/>
</set>

当然最后不要忘记在你的Activity中override onTouch方法来获取手势action:

@Override
public boolean onTouchEvent(MotionEvent event) {
if (gestureDetector.onTouchEvent(event))
return true;
else
return false;
}

这是view animation的一个截图:
 

源代码在附件中 ^_^

评论

31 楼 tubinting 2014-09-03  

学习了

30 楼 lordhong 2010-01-26  

zolomon 写道

这个效果真的不错,我很想做一个像andorid自带的ListView那样的效果,只不过是一个横向的,可是摸不到头脑,看了lordhong的这个帖子有了些启发,可是下一步又摸不到头脑了:(不知道lordhong可否指点一二?

看下ListView的源代码... 很晕的... 不过实现的思路也在那里, 呵呵

29 楼 zolomon 2010-01-21  

这个效果真的不错,我很想做一个像andorid自带的ListView那样的效果,只不过是一个横向的,可是摸不到头脑,看了lordhong的这个帖子有了些启发,可是下一步又摸不到头脑了:(不知道lordhong可否指点一二?

28 楼 lordhong 2009-12-10  

freedombelief 写道

lordhong 写道

vlinux 写道

看不出，看头像挺年轻的，我们公司工作10年以上的都已经写在脸上或者刻印在头发上了

because... you are looking at my pic that was taken 10 years ago... Orz...

ORZ。。刚看了鲁豫有约--黄渤的那期。。。大牛和他真像啊

说错了吧... 是他和我真像... =.=#

27 楼 freedombelief 2009-12-10  

lordhong 写道

vlinux 写道

看不出，看头像挺年轻的，我们公司工作10年以上的都已经写在脸上或者刻印在头发上了

because... you are looking at my pic that was taken 10 years ago... Orz...

ORZ。。刚看了鲁豫有约--黄渤的那期。。。大牛和他真像啊

26 楼 lordhong 2009-11-22  

vlinux 写道

看不出，看头像挺年轻的，我们公司工作10年以上的都已经写在脸上或者刻印在头发上了

because... you are looking at my pic that was taken 10 years ago... Orz...

25 楼 vlinux 2009-11-21  

看不出，看头像挺年轻的，我们公司工作10年以上的都已经写在脸上或者刻印在头发上了

24 楼 lordhong 2009-11-20  

skynetbird 写道

你的文章看的很多，非常赞啊，也是一直做技术的吧。

是~~~~~ IT民工超过10年了...

23 楼 skynetbird 2009-11-20  

你的文章看的很多，非常赞啊，也是一直做技术的吧。

22 楼 yuankai 2009-11-13  

你用的是SDK2.0还是1.5 ???

21 楼 lordhong 2009-11-13  

mnastronomy 写道

请问楼主，怎么样才能判断目前翻到多少页了？

android listview没有页的概念

20 楼 mnastronomy 2009-11-12  

请问楼主，怎么样才能判断目前翻到多少页了？

19 楼 lordhong 2009-07-09  

skyxiaobai 写道

请教一下：
一个list里面有很多item，如联系人等，用手指向上滚动，item向上滚动，现在是最后一个item滚到底部时就不动了，但要求是最后一个滚到底部后继续向上滚动一段距离后接着向下滚动到底部。

你说的这个模式是iPhone的UI模式, android要安装android的模式来编程, 不是技术上的限制, 而是用户习惯的问题.

18 楼 skyxiaobai 2009-07-09  

请教一下：
一个list里面有很多item，如联系人等，用手指向上滚动，item向上滚动，现在是最后一个item滚到底部时就不动了，但要求是最后一个滚到底部后继续向上滚动一段距离后接着向下滚动到底部。
还有 trackmotionscroll方法的使用。
谢谢了

17 楼 fc6029585 2009-06-03  

大哥..
你好强啊..
我想做你徒弟啊!!!

16 楼 lordhong 2009-04-27  

softcat 写道

我也看了一些android的源码，感觉没您这么深刻啊，能不能说一下，怎么写的好了，我也学习领会一下。

你看下homescreen那个slidingdraw那个widget, 就是主menu那个... 

15 楼 softcat 2009-04-27  

lordhong 写道

flygo 写道

终于可以发帖了，真是等了好久了，每次注册一个帐号都要等一天才能发帖，但后来又忘了帐号。真是晕。我每天几乎会来看一下，今天我也回个帖。我可是冲着lordhong来的哦。看了你的很多帖子，非常的不错，也感谢你给我们提供好的资料。但移动的这个版块现在有点冷清的，我相信以后会火的，我也会，我因为最近也想搞移动方面的开发，我本来是做j2ee的，但是我所在公司是做移动应用的，感觉自己是在给他们做陪衬的，而且他们是用c++做的开发，也瞧不起java，晕死，心里不爽啊，的确在操作比效底层东西上面java还是不行，速度也的确有点慢。最近有空在看c++，想着这个还是比效有用，计算机上和手机上都可做开发，而且经久不衰的，java这两年不行了，真是成白菜价了，所以也想往 C/c++ 这个方向发展，但自己还一直在犹豫，不知道具体的方向，手机的平台也多。

我也终于可以发帖了... 这几天连续做了好几次脑残测试... Orz...

就冲你是冲我来的... 我就回答下... 一般人... 我不告诉的... 

你公司具体是做什么的? embedded linux吗?  一般这些只用到C, C++反而较少, 太底层了.
android基本上都是通过JNI(Java Native Interface)来call这些C的库.  对于我们新手来说, 起步是挺困难的.
我们可以先从Android的代码开始看, 由浅入深, 慢慢深入到C方面.  这需要一个过程, 要有耐心和恒心.

不过如果你可以精通android的源码的话, 已经是大牛一只了.  我最近开始看了下android的源码, 那个打击啊... 人与人的差距... 真大啊~~~~~~ 

我也看了一些android的源码，感觉没您这么深刻啊，能不能说一下，怎么写的好了，我也学习领会一下。

14 楼 poppy_zy 2009-04-25  

lordhong 写道

^_^ 不错, 大家互相学习, 呵呵

横向翻页的话用ViewFlipper这个东西, 很好用的, 我的这个贴的源码里有.

您的这个例子我学习了 但是横向翻页的话 就不能有滚动条了 

13 楼 lordhong 2009-04-24  

^_^ 不错, 大家互相学习, 呵呵

横向翻页的话用ViewFlipper这个东西, 很好用的, 我的这个贴的源码里有.

12 楼 poppy_zy 2009-04-24  

lordhong 写道

ScrollView自身对onTouch这些event有捕捉的.
你看看能不能override它的一些onTouch功能

其实我是想实现textview横向翻页的。自己瞎写了点代码总算实现了，谢谢您的帮助

tv.setOnTouchListener(new OnTouchListener() {
			float x_down = -1;
			float x_up = -1;
			float f_down = -1;
			float f_up = -1;

			public boolean onTouch(View v, MotionEvent event) {

				if (event.getAction() == MotionEvent.ACTION_DOWN) {
					x_down = event.getRawX();
					if (x_down != -1) {
						f_down = x_down;
					}
				}
				if (event.getAction() == MotionEvent.ACTION_UP) {
					x_up = event.getRawX();
					if (x_up != -1) {
						f_up = x_up;
					}
				}
				if (x_up != -1 && x_down != -1) {
					
					System.out.println(f_down + "     " + f_up);

					if (f_down - f_up > 50) {
						System.out.println("上一页");
					} else if (f_down - f_up < -50) {
						System.out.println("下一页");
					}
					f_down = -1;
					f_up = -1;
					x_down = -1;
					x_up = -1;
				}
				return true;
			}
		});

java新手 见笑了