Activity滑动返回效果的实现

作者: Domon_Lee | 来源:发表于2016-07-01 14:05 被阅读1452次

Activity滑动返回效果的实现

在很多的App中,都会发现利用手指滑动事件,进行高效且人性化的交互。在一个大家越来越触摸不到屏幕左上方返回键的大屏幕时代,若执拗的不去改变自己的设计方法,不去换一种思路,那就是自寻死路

在详情页面中,我希望有两种方式来进行返回:

  1. 点击左上角的返回按钮,返回上一级
  2. 手指从左往右滑动,返回上一级

方法一: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

注:在没有指定的时候,默认是以自己为相对参照物。属性中+%表示和自身的百分比,+p表示以父View为参考。

方法二: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对象

我兴高采烈的配置完毕,发现犯傻了。由于的我项目需要,我将我的布局写成了ScrollView,所以首先会执行scrollView中的onTouchEvent(),而且会返回true,事件停止传播。这就会导致上面写的OnTouchEvent将不会被回调了。

解决的办法就是自己自定义一个ScrollView

  • Override onTouchEvent()方法,并让它返回true
  • 在将之前布局中的ScrollView用新的替换掉

万事OK,按下F11,噫?怎么搞的,还是返回不了嘛,而且就没有滑动的说(因为我在OnTouchEvent中添加了log)。

再一次,我踏上了除虫之旅。

仔细的分析过后发现,ScrollView中的高度好像不对,并没有像我想象的那样填满整个控件,但是我设置的属性的的确确是fill_parent呐。查了查Google,才发现要想填满整个ScrollView时,fill_parent属性是不管用的。必须设置fillViewport="true"

这样改了改,总算完成了预定想法。

想起来一个人在知乎上面说的话:“做Android开发就是,解决了一个问题,又有无数个问题冒出来。”

对此,我深感赞同。

Have a nice day.


相关文章

  • Activity滑动返回效果的实现

    Activity滑动返回效果的实现 在很多的App中,都会发现利用手指滑动事件,进行高效且人性化的交互。在一个大家...

  • 实现Activity滑动退出

    实现Activity滑动退出 很多应用在二级详情页面加入了滑动退出activity的效果,很方便,心血来潮,想着自...

  • 侧滑效果[第十二篇]:侧滑框架SmartSwipe之仿微信返回效

    首先看下效果: 这个效果的Activity返回效果和微信很相似。 SmartSwipe框架中实现仿微信返回效果的类...

  • 全屏侧滑效果

    前言 此次文章讲述的是如果改变系统的侧滑返回效果,实现全屏滑动返回效果。效果如图: 接下来看我们是如何是如何实现全...

  • 对导航控制器的2种滑动返回功能的补充

    继凌晨的那一篇实现在自定义导航栏返回按钮的情况下实现和系统自带的滑动返回效果文章后,继续完成全屏返回的效果 实现这...

  • 滑动返回-方式2

    之前写过一个 在Activity 里面,利用dispatchTouchEvent方法,实现了滑动返回,今天写一个自...

  • Android activity滑动返回

    前言 activity的滑动返回也是个常用的功能,网上有很多介绍怎么去实现的库,我测过其中几个,包括star比较多...

  • Activity滑动返回操作

    这是仿QQ与支付宝等毒瘤软件的滑动返回的一个教程,虽然IOS的风格不一定适用与Android,但是用手向回滑动就可...

  • iOS页面返回之滑动手势

    现在许多App都有滑动手势让页面返回的效果,在这里先上两个效果图: 效果一的实现 要实现效果一,只需要几行代码 首...

  • 全屏滑动返回的实现

    全屏滑动返回功能的实现: 1. 实现边缘滑动返回 默认导航控制器都是有滑动返回功能,由于我们自定义了控制器的返回按...

网友评论

    本文标题:Activity滑动返回效果的实现

    本文链接:https://www.haomeiwen.com/subject/scgfjttx.html