100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > Android RecyclerView实现侧滑删除

Android RecyclerView实现侧滑删除

时间:2020-04-11 17:51:00

相关推荐

Android RecyclerView实现侧滑删除

距上次写博客有半年多了,回忆起来都觉得不可思议,中间也想憋俩大招,总是被耽误,这俩月忙完之后,终于空下来了,恰好新项目我和UI俩人商量一下,用MD来实现app。中间有个需求是RecyclerView中侧滑显示删除按钮,点击删除。于是就有了这篇博客。

一、目标与分析

先上图:

1. 目标

如图所示,我们的目标是实现在RecyclerView中实现:

向左侧滑超出菜单按钮一半宽度能够使item展示出菜单按钮;向左甩动显示菜单按钮;支持菜单按钮点击消失;不影响RecyclerView的正常功能。

2. 实现难点与关键点

说明一下,在这里我采用的是在RecyclerView中进行触摸判断拦截,然后处理子View实现的。并没有采用在子View中使用requestDisallowInterceptTouchEvent(true)的方式阻止父View的拦截来处理,尽量减小对RecyclerView的影响。

如何定位被触摸到的子View如何判断是侧滑还是RecyclerView的正常上下滑动松开手怎样实现平滑滚动如何判断甩动

二、实现原理解析

下面来以一一分析上面的问题。

1. 如何定位被触摸到的子View

先来说说ListView

熟悉ListView的同学肯定知道,在ListView中有个pointToPosition(int x, int y)的方法,该方法其实是其父类AbsListView中实现的,作用就是定位触摸点在list中mTouchPosition。但是这个position并不是子view的下标position,我们知道ListView以及RecyclerView的实现都是采用ViewHolder模式对View进行了复用,其实界面上只有那几个View,不是随着数据项的增加而增加,因此通过getChildAt(position)的方式其实并不能获得真正被触摸到的View。

在ListView中还有个getFirstVisiblePosition()的方法,当然还是AbsListView中实现的,该方法用于获得屏幕上展示的第一个ItemView对应的数据集合中数据的mFirstPosition。这样,我们有了第一个位置的mFirstPosition,又有了触摸点的mTouchPosition,两个位置相减,就得到了被触摸到的子View的下标position,这样再通过getChildAt(position)的方式即可获得触摸点的子View。

RecyclerView如何

Ok,上面是ListView中的触摸点子View获取方式,那么问题来了,挖掘机技术哪家强?

这些方式是否适用于RecyclerView?答案是不适用,因为ListView继承了AbsListView从而具有了这些便捷的方法,而RecyclerView却是继承了ViewGroup实现的,并没有上面的俩方法。怎么搞?

很简单,我们在使用RecyclerView实现ListView的效果时,一定要设置其LayoutManager为LinearLayoutManager,而LinearLayoutManager的类说明是:

A RecyclerView.LayoutManager implementation which provides similar functionality to android.widget.ListView.

很简单,LayoutManager 提供了与ListView相似的功能。不bb了,其实就是findFirstVisibleItemPosition()方法,可以实现与getFirstVisiblePosition()一样的效果,而pointToPosition(int x, int y)这个则没有提供,因此我们需要自己来实现,代码如下:

private static final int INVALID_POSITION = -1; // 触摸到的点不在子View范围内private Rect mTouchFrame; // 子View所在的矩形范围public int pointToPosition(int x, int y) {int firstPosition = ((LinearLayoutManager) getLayoutManager()).findFirstVisibleItemPosition();Rect frame = mTouchFrame;if (frame == null) {mTouchFrame = new Rect();frame = mTouchFrame;}final int count = getChildCount();for (int i = count - 1; i >= 0; i--) {final View child = getChildAt(i);if (child.getVisibility() == View.VISIBLE) {child.getHitRect(frame);if (frame.contains(x, y)) {return firstPosition + i;}}}return INVALID_POSITION;}

分析一下:首先获取第一个View对应的mFirstPosition,然后使用Rect.contains(x, y)通过遍历所有子View的范围来确定指定的点所在的子view。然后position + i,即可获得到触碰点的position。

代码是直接从AbsListView中copy过来用的,我在AbsListView源码中看了一下,这个方法并没有涉及到别的逻辑,里面用到的方法包括getChildCount()、getHitRect(Rect)都是ViewGroup、View以及Rect的方法,mTouchFrame则是缓存Rect用的,只在这个方法里使用,不会产生冲突,因此可以直接使用。

当然,你也可以直接仿照上面的方法,直接获取到触碰点所在的子View,这样也很方便。

2. 侧滑还是RecyclerView的正常滑动? 如何判断甩动

说说这个甩动的问题,甩动,我们这里通过VelocityTracker速度器来进行速度的判断,VelocityTracker这个我就不细说了,大致的几个api:

mVelocityTracker.addMovement(event); // 添加触摸点puteCurrentVelocity(1000); // 计算1s内x轴方向移动速度mVelocityTracker.getXVelocity(); // 获取x方向移动速度,负值表示向左滑动

至于滑动的选择,我们在onInterceptTouchEvent(MotionEvent)中进行判断拦截:

@Overridepublic boolean onInterceptTouchEvent(MotionEvent e) {int x = (int) e.getX();int y = (int) e.getY();obtainVelocity(e);switch (e.getAction()) {case MotionEvent.ACTION_DOWN:...mPosition = pointToPosition(x, y); // 获取触碰点所在的positionif (mPosition != INVALID_POSITION) {View view = mFlingView;// 获取触碰点所在的viewmFlingView = (ViewGroup) getChildAt(mPosition - ((LinearLayoutManager) getLayoutManager()).findFirstVisibleItemPosition());// 这里判断一下如果之前触碰的view已经打开,而当前碰到的view不是那个view则立即关闭之前的view,此处并不需要担动画没完成冲突,因为之前已经abortAnimationif (view != null && mFlingView != view && view.getScrollX() != 0) {view.scrollTo(0, 0);}// 这里进行了强制的要求,RecyclerView的子ViewGroup必须要有2个子view,这样菜单按钮才会有值,// 需要注意的是:如果不定制RecyclerView的子View,则要求子View必须要有固定的width。// 比如使用LinearLayout作为根布局,而content部分width已经是match_parent,此时如果菜单view用的是wrap_content,menu的宽度就会为0。if (mFlingView.getChildCount() == 2) {mMenuViewWidth = mFlingView.getChildAt(1).getWidth();} else {mMenuViewWidth = INVALID_CHILD_WIDTH;}}break;case MotionEvent.ACTION_MOVE:puteCurrentVelocity(1000);// 此处有俩判断,满足其一则认为是侧滑:// 1.如果x方向速度大于y方向速度,且大于最小速度限制;// 2.如果x方向的侧滑距离大于y方向滑动距离,且x方向达到最小滑动距离;// 注意:之所以要小于负值,是因为向左滑则速度为负值float xVelocity = mVelocityTracker.getXVelocity();float yVelocity = mVelocityTracker.getYVelocity();if (Math.abs(xVelocity) > SNAP_VELOCITY && Math.abs(xVelocity) > Math.abs(yVelocity)|| Math.abs(x - mFirstX) >= mTouchSlop&& Math.abs(x - mFirstX) > Math.abs(y - mFirstY)) {mIsSlide = true;return true;}break;case MotionEvent.ACTION_UP:releaseVelocity();break;}return super.onInterceptTouchEvent(e);}

上面的代码注释的很清楚,首先在ACTION_DOWN的时候获取到触碰到的子View。然后在ACTION_MOVE时,速度和距离满足其一,即认为需要拦截:

X轴方向滑动速度大于Y轴方向滑动速度,且X轴方向速度大于最小滑动速度;X轴方向滑动距离大于Y轴方向滑动距离,且X轴方向距离大于最小滑动距离。

还有几个需要注意的地方是:

如果ACTION_DOWN时,已经有view已经展开,而当前碰到的不是之前的view,要把之前展开的按钮给隐藏起来,但是如果是之前的View,则不会有变化;为了方便扩展菜单按钮,因此这里限制了只允许ItemView拥有两个子View;注意在最后释放VelocityTracker。

3. 松开手怎样实现平滑滚动

平滑滚动,我们使用了Scroller进行了滑动的辅助处理,这个网上讲述的很多,不多说了。

看一下处理view的代码:

@Overridepublic boolean onTouchEvent(MotionEvent e) {if (mIsSlide && mPosition != INVALID_POSITION) {float x = e.getX();obtainVelocity(e);switch (e.getAction()) {case MotionEvent.ACTION_DOWN: // 因为没有拦截,所以不会被调用到break;case MotionEvent.ACTION_MOVE:// 随手指滑动if (mMenuViewWidth != INVALID_CHILD_WIDTH) {float dx = mLastX - x;if (mFlingView.getScrollX() + dx <= mMenuViewWidth&& mFlingView.getScrollX() + dx > 0) {mFlingView.scrollBy((int) dx, 0);}mLastX = x;}break;case MotionEvent.ACTION_UP:if (mMenuViewWidth != INVALID_CHILD_WIDTH) {int scrollX = mFlingView.getScrollX();puteCurrentVelocity(1000);// 此处有两个原因决定是否打开菜单:// 1.菜单被拉出宽度大于菜单宽度一半;// 2.横向滑动速度大于最小滑动速度;// 注意:之所以要小于负值,是因为向左滑则速度为负值if (mVelocityTracker.getXVelocity() < -SNAP_VELOCITY) { // 向左侧滑达到侧滑最低速度,则打开mScroller.startScroll(scrollX, 0, mMenuViewWidth - scrollX, 0, Math.abs(mMenuViewWidth - scrollX));} else if (mVelocityTracker.getXVelocity() >= SNAP_VELOCITY) { // 向右侧滑达到侧滑最低速度,则关闭mScroller.startScroll(scrollX, 0, -scrollX, 0, Math.abs(scrollX));} else if (scrollX >= mMenuViewWidth / 2) { // 如果超过删除按钮一半,则打开mScroller.startScroll(scrollX, 0, mMenuViewWidth - scrollX, 0, Math.abs(mMenuViewWidth - scrollX));} else { // 其他情况则关闭mScroller.startScroll(scrollX, 0, -scrollX, 0, Math.abs(scrollX));}invalidate();}...releaseVelocity();break;}return true;} else {// 此处防止RecyclerView正常滑动时,还有菜单未关闭closeMenu();// Velocity,这里的释放是防止RecyclerView正常拦截了,但是在onTouchEvent中却没有被释放;// 有三种情况:1.onInterceptTouchEvent并未拦截,在onInterceptTouchEvent方法中,DOWN和UP一对获取和释放;// 2.onInterceptTouchEvent拦截,DOWN获取,但事件不是被侧滑处理,需要在这里进行释放;// 3.onInterceptTouchEvent拦截,DOWN获取,事件被侧滑处理,则在onTouchEvent的UP中释放。releaseVelocity();}return super.onTouchEvent(e);}

Ok,上面是手指滑动的view处理,注释也都标了:

DOWN事件因为没有被拦截,所以不会处理;MOVE事件,如果滑动的范围在菜单的距离限制内,则随着手指滑动;UP事件,上面写的很清楚,如果菜单被拉出超过一半,或者是甩动,就都会打开(或关闭)菜单。

同样,也有几点需要注意的:

我们要限制随手指滑动时,不能超出菜单宽度的范围,当然如果你有需求也可以修改这里;UP时,一定要调用puteCurrentVelocity(1000)计算速度;最后UP的几个条件要注意,因为X轴速度getXVelocity()负值表示向左滑动,正值表示向右,这里会先判断速度,如果速度满足条件,则不论菜单被拉出的范围都要进行相应的打开或关闭操作。如果速度不达到条件,则会根据菜单被拉出的宽度范围来决定菜单是关上还是打开;

VelocityTracker的释放操作,如上面的注释,有三个地方需要对其进行释放:

onInterceptTouchEvent并未拦截,在onInterceptTouchEvent方法中,DOWN和UP一对获取和释放;onInterceptTouchEvent拦截,DOWN获取,但事件不是被侧滑处理,需要先在onTouchEvent中释放掉;onInterceptTouchEvent拦截,DOWN获取,事件被侧滑处理,则在onTouchEvent的UP中释放。

三、代码与注意事项

完整代码放在GitHub上:RecyclerView实现侧滑

最后,为了不写死菜单按钮的点击事件,我们把菜单的点击事件留给用户自己在Adapter中实现,同时也暴露了closeMenu()方法来用于用户点击菜单之后手动关闭菜单。

注意:由于没有定制ItemView,所以如果我们使用LinearLayout作为Item根布局而内容区域宽度为MATCH_PARENT时,菜单按钮要有指定的大小,不能是WRAP_CONTENT,因为那样会使菜单按钮宽度为0,则没有滑动效果。当然如果你自己定制了ItemView,同时指定了菜单宽度,也是可以的。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。