Activity滑动返回效果的实现
在很多的App中,都会发现利用手指滑动事件,进行高效且人性化的交互。在一个大家越来越触摸不到屏幕左上方返回键的大屏幕时代,若执拗的不去改变自己的设计方法,不去换一种思路,那就是自寻死路。
首先说说我想要得到的效果,如上上一篇文章--SlidingMenu中,我配置和实现好了SlidingMenu,为其中的Item都添加了监听事件。接下来,我捕获到它们各自所处的位置,然后跳转到不同的详情界面。在详情页面中,我希望有两种方式来进行返回:
- 点击左上角的返回按钮,返回上一级
- 手指从左往右滑动,返回上一级
方法一:OnClickListener
该方法很简单粗暴,为你的返回按钮添加监听事件,调用finish(),同时可以在finish之后,实现一些动画效果。比如我用的:overridePendingTransition(R.anim.push_left_in,
R.anim.push_right_out);
R.anim.push_left_in也很简单:
<translate android:fromXDelta="100%" android:toXDelta="0"
android:duration="600" />
R.anim.push_left_out:
android:fromXDelta="0" android:toXDelta="100%"
这就能实现一个很简单的滑动滑出的动画。
在做这个动画的时候,不太理解其中属性的含义,一直出不来自己想要的结果。搜索了很多,然后自己也总结一下:
- fromXDelta 动画起始时X坐标位置(左正右负,下同)
- toXDelta 动画结束时X坐标位置
- fromYDelta 动画起始时Y坐标位置
- toYDelta 动画结束时Y坐标位置
- duration 动画的持续时间ms
方法二:onTouchEvent
大概的思路就是:监听手势按下以及移动的距离和速度,若超过合理的范围,我就认定用户是在返回 说起来还是很简单,实现起来也不是特别的复杂。我将其写入在我的菜单基类里面,便于其他菜单继承。- 设置向右滑动的最小速度SPEED_MIN = 200;
- 设置向右滑动的最小距离DISTANCE_MIN = 150;
- 用两个变量,记录手指按下时的横坐标xDown,和移动时的横坐标xMove;
- 在onTouch中得到xMove-xDown之间的距离,并通过函数计算出当时的速度。若都大于最小值,则判定用户是在返回,调用finish();
- 创建VelocityTracker对象,并将触摸content界面的滑动事件加入到VelocityTracker当中
mVelocityTracker.addMovement(event);
- 通过getScrollVelocity(),获得手指的当前滑动速度(滑动速度依靠的是每秒钟多少像素)
private int getScrollVelocity() {
mVelocityTracker.computeCurrentVelocity(1000);
int velocity = (int) mVelocityTracker.getXVelocity();
return Math.abs(velocity);
}
- 记住在MotionEvent.ACTION_UP中回收VelocityTracker对象
- Override onTouchEvent()方法,并让它返回true
- 在将之前布局中的ScrollView用新的替换掉