Android实现类似QQ的滑动删除效果

不念不忘少年蓝@ 2022-08-19 12:22 234阅读 0赞

观察QQ的滑动删除效果，可以猜测可以滑动删除的部分主要包含两个部分，一个是内容区域（用于放置正常显示的view），另一个是操作区域（用于放置删除按钮）。默认情况下，操作区域是不显示的，内容区域的大小是填充整个容器，操作区域始终位于内容区域的右面。当开始滑动的时候，整个容器中的所有子view都像左滑动，如果操作区域此时是不可见的，设置为可见。  
  
我的实现思路就是自定义一个layout SwipeLayout继承自FrameLayout。SwipeLayout包含两个子view，第一个子view是内容区域，第二个子view是操作区域。滑动效果的控制，主要就是通过检测SwipeLayout的touch事件来实现，这里我不想自己去通过监听touch事件来实现滑动效果，那是一个很繁琐的过程。Android support库里其实已经提供了一个很好的工具类来帮我们做这件事情ViewDragHelper。如果你看过Android原生的DrawerLayout的代码，就会发现DrawerLayout的滑动效果也是通过ViewDragHelper类实现的。  
  
下面先介绍一下ViewDragHelper类的使用。

首先需要在容器中创建一个ViewDragHelper类的对象。

**\[java\]**  [view plain][] [copy][view plain]

1.  mDragHelper = ViewDragHelper.create(**this**, 1.0f, **new** ViewDragHelper.Callback());

接下来要把容器的事件处理委托给ViewDragHelper对象

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.  **public** **boolean** onInterceptTouchEvent(MotionEvent event) \{  
3.      **if** (mDragHelper.shouldInterceptTouchEvent(event)) \{  
4.              **return** **true**;  
5.      \}  
6.      **return** **super**.onInterceptTouchEvent(event);  
7.  \}  
8.    
9.  @Override  
10. **public** **boolean** onTouchEvent(MotionEvent event) \{  
11.     mDragHelper.processTouchEvent(event);  
12.     **return** **true**;  
13. \}

ViewDragHelper对象来决定motion event是否是属于拖动过程。如果motion event属于拖动过程，那么触摸事件就交给ViewDragHelper来处理，ViewDragHelper在处理拖动过程的时候，会调用ViewDragHelper.Callback对象的一系列方法。  
我们可以通过ViewDragHelper.Callback来监听以下几种事件：  
1.拖动的状态改变  
2.被拖动的view的位置改变  
3.被拖动的view被放开的时间和位置  
  
ViewDragHelper.Callback还提供了几个方法用来影响拖动过程。  
1.控制view可以拖动的范围  
2.确定某个view是否可以拖动  
  
好了，直接看代码分析吧。  
  
在SwipeLayout的inflate事件中，获取到contentView和actionView。

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.      **protected** **void** onFinishInflate() \{  
3.          contentView = getChildAt(0);  
4.          actionView = getChildAt(1);  
5.          actionView.setVisibility(GONE);  
6.      \}

在SwipeLayout的measure事件中，设置拖动的距离为actionView的宽度。

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.      **protected** **void** onMeasure(**int** widthMeasureSpec, **int** heightMeasureSpec) \{  
3.          **super**.onMeasure(widthMeasureSpec, heightMeasureSpec);  
4.    
5.          dragDistance = actionView.getMeasuredWidth();  
6.      \}

定义DragHelperCallback extends ViewDragHelper.Callback  
  
  
DragHelperCallback的tryCaptureView方法，用来确定contentView和actionView是可以拖动的

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.      **public** **boolean** tryCaptureView(View view, **int** i) \{  
3.          **return** view == contentView || view == actionView;  
4.      \}

DragHelperCallback的onViewPositionChanged在被拖动的view位置改变的时候调用，如果被拖动的view是contentView，我们需要在这里更新actionView的位置，反之亦然。

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.      **public** **void** onViewPositionChanged(View changedView, **int** left, **int** top, **int** dx, **int** dy) \{  
3.          draggedX = left;  
4.          **if** (changedView == contentView) \{  
5.              actionView.offsetLeftAndRight(dx);  
6.          \} **else** \{  
7.              contentView.offsetLeftAndRight(dx);  
8.          \}  
9.          **if** (actionView.getVisibility() == View.GONE) \{  
10.             actionView.setVisibility(View.VISIBLE);  
11.         \}  
12.         invalidate();  
13.     \}

DragHelperCallback的clampViewPositionHorizontal用来限制view在x轴上拖动，要实现水平拖动效果必须要实现这个方法，我们这里因为仅仅需要实现水平拖动，所以没有实现clampViewPositionVertical方法。

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.    **public** **int** clampViewPositionHorizontal(View child, **int** left, **int** dx) \{  
3.        **if** (child == contentView) \{  
4.            **final** **int** leftBound = getPaddingLeft();  
5.            **final** **int** minLeftBound = -leftBound - dragDistance;  
6.            **final** **int** newLeft = Math.min(Math.max(minLeftBound, left), 0);  
7.            **return** newLeft;  
8.        \} **else** \{  
9.            **final** **int** minLeftBound = getPaddingLeft() + contentView.getMeasuredWidth() - dragDistance;  
10.           **final** **int** maxLeftBound = getPaddingLeft() + contentView.getMeasuredWidth() + getPaddingRight();  
11.           **final** **int** newLeft = Math.min(Math.max(left, minLeftBound), maxLeftBound);  
12.           **return** newLeft;  
13.       \}  
14.   \}

DragHelperCallback的getViewHorizontalDragRange方法用来限制view可以拖动的范围

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.      **public** **int** getViewHorizontalDragRange(View child) \{  
3.          **return** dragDistance;  
4.      \}

DragHelperCallback的onViewReleased方法中，根据滑动手势的速度以及滑动的距离来确定是否显示actionView。smoothSlideViewTo方法用来在滑动手势之后实现惯性滑动效果

**\[java\]**  [view plain][] [copy][view plain]

1.  @Override  
2.      **public** **void** onViewReleased(View releasedChild, **float** xvel, **float** yvel) \{  
3.          **super**.onViewReleased(releasedChild, xvel, yvel);  
4.          **boolean** settleToOpen = **false**;  
5.          **if** (xvel > AUTO\_OPEN\_SPEED\_LIMIT) \{  
6.              settleToOpen = **false**;  
7.          \} **else** **if** (xvel < -AUTO\_OPEN\_SPEED\_LIMIT) \{  
8.              settleToOpen = **true**;  
9.          \} **else** **if** (draggedX <= -dragDistance / 2) \{  
10.             settleToOpen = **true**;  
11.         \} **else** **if** (draggedX > -dragDistance / 2) \{  
12.             settleToOpen = **false**;  
13.         \}  
14.   
15.         **final** **int** settleDestX = settleToOpen ? -dragDistance : 0;  
16.         viewDragHelper.smoothSlideViewTo(contentView, settleDestX, 0);  
17.         ViewCompat.postInvalidateOnAnimation(SwipeLayout.**this**);  
18.     \}

最终的效果：  
![Center][]

代码下载  
github地址：[https://github.com/lzyzsd/SwipeLayout][https_github.com_lzyzsd_SwipeLayout]

原文：http://blog.csdn.net/lzyzsd/article/details/41492783

[view plain]: http://blog.csdn.net/lzyzsd/article/details/41492783#
[Center]: /images/20220731/f23752c169334ecea0062d80742d8999.png
[https_github.com_lzyzsd_SwipeLayout]: https://github.com/lzyzsd/SwipeLayout