查看: 963|回复: 0

[手机开发] android的RecyclerView实现拖拽排序和侧滑删除示例

发表于 2017-8-1 08:00:04
尚学堂AD

在平时开发应用的时候,经常会遇到列表排序、滑动删除的需求。如果列表效果采用的是 ListView 的话,需要经过自定义 View 才能实现效果;但是如果采用的是 RecyclerView 的话,系统 API 就已经为我们提供了相应的功能。

接下来,我们就来看一下怎么用系统 API 来实现排序和删除的效果。

创建 ItemTouchHelper

创建一个 ItemTouchHelper 对象,然后其调用 attachToRecyclerView 方法:

  1. RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
  2. recyclerView.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false));
  3. RecyclerViewAdapter adapter = new RecyclerViewAdapter();
  4. ItemTouchHelper helper = new ItemTouchHelper(new MyItemTouchCallback(adapter));
  5. helper.attachToRecyclerView(recyclerView);
复制代码

在创建 ItemTouchHelper 对象时候,需要我们传入一个实现了 ItemTouchHelper.Callback 接口的对象。而排序和删除的逻辑都封装在了这个 ItemTouchHelper.Callback 的对象里面了。

实现 ItemTouchHelper.Callback 接口

创建 MyItemTouchCallback 类,实现 ItemTouchHelper.Callback 接口:

  1. public class MyItemTouchCallback extends ItemTouchHelper.Callback {
  2. private final RecyclerViewAdapter adapter;
  3. public MyItemTouchCallback(RecyclerViewAdapter adapter) {
  4. this.adapter = adapter;
  5. }
  6. @Override
  7. public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
  8. return 0;
  9. }
  10. @Override
  11. public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
  12. return false;
  13. }
  14. @Override
  15. public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
  16. }
  17. }
复制代码

实现 ItemTouchHelper.Callback 接口后有三个方法需要重写:

  • getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) :设置滑动类型的标记。需要设置两种类型的 flag ,即 dragFlags 和 swipeFlags ,分别代表着拖拽标记和滑动标记。最后需要调用 makeMovementFlags(dragFlags, swipeFlags) 方法来合成返回。
  • onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) :当用户拖拽列表某个 item 时会回调。很明显,拖拽排序的代码应该在这个方法中实现。
  • onSwiped(RecyclerView.ViewHolder viewHolder, int direction) :当用户滑动列表某个 item 时会回调。所以侧滑删除的代码应该在这个方法中实现。

重写方法

我们先来看看 getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) 方法:

  1. @Override
  2. public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
  3. int dragFlag;
  4. int swipeFlag;
  5. RecyclerView.LayoutManager layoutManager = recyclerView.getLayoutManager();
  6. if (layoutManager instanceof GridLayoutManager) {
  7. dragFlag = ItemTouchHelper.DOWN | ItemTouchHelper.UP
  8. | ItemTouchHelper.RIGHT | ItemTouchHelper.LEFT;
  9. swipeFlag = 0;
  10. } else {
  11. dragFlag = ItemTouchHelper.DOWN | ItemTouchHelper.UP;
  12. swipeFlag = ItemTouchHelper.END;
  13. }
  14. return makeMovementFlags(dragFlag, swipeFlag);
  15. }
复制代码

代码中根据 layoutManager 分为了两种情况:

  • 如果是 GridLayoutManager ,那么拖拽排序就可以细分为上下左右四个方向了,而且 GridLayoutManager 没有侧滑删除的功能;
  • 若是其他的 LayoutManager ,比如说 LinearLayoutManager ,那么拖拽排序就只有上下两个方向了,并且设置 swipeFlag 为 ItemTouchHelper.END 类型;
  • 对于其他自定义类型的 LayoutManager 可以自己根据自身情况补充。

下面就是 onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) 方法:

  1. @Override
  2. public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
  3. int fromPosition = viewHolder.getAdapterPosition();
  4. int toPosition = target.getAdapterPosition();
  5. if (fromPosition < toPosition) {
  6. for (int i = fromPosition; i < toPosition; i++) {
  7. Collections.swap(adapter.getDataList(), i, i + 1);
  8. }
  9. } else {
  10. for (int i = fromPosition; i > toPosition; i--) {
  11. Collections.swap(adapter.getDataList(), i, i - 1);
  12. }
  13. }
  14. recyclerView.getAdapter().notifyItemMoved(fromPosition, toPosition);
  15. return true;
  16. }
复制代码

之前说过了,onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) 方法是用户在拖拽 item 的时候会回调。所以关于列表排序的代码应该写在这里。方法参数中的 viewHolder 代表的是用户当前拖拽的 item ,而 target 代表的是被用户拖拽所覆盖的那个 item 。所以在 onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) 方法中的逻辑就是把 fromPosition 至 toPosition 为止改变它们的位置。

最后就是 onSwiped(RecyclerView.ViewHolder viewHolder, int direction) 方法了:

  1. @Override
  2. public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
  3. int position = viewHolder.getAdapterPosition();
  4. if (direction == ItemTouchHelper.END) {
  5. adapter.getDataList().remove(position);
  6. adapter.notifyItemRemoved(position);
  7. }
  8. }
复制代码

这个方法在用户进行侧滑删除操作的时候会回调,其中的逻辑就是得到当前用户进行侧滑删除操作的 item ,然后将其删除。

到了这里,大功告成了。那么来看看效果吧:

效果图

改善用户体验

我们发现还有一些不完美的地方:比如当用户在拖拽排序的时候,可以改变当前拖拽 item 的透明度,这样就可以和其他 item 区分开来了。那么,我们需要去重写 onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) 方法:

  1. @Override
  2. public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
  3. super.onSelectedChanged(viewHolder, actionState);
  4. if (actionState == ItemTouchHelper.ACTION_STATE_DRAG) {
  5. viewHolder.itemView.setBackgroundColor(Color.BLUE);
  6. }
  7. }
复制代码

相对应地,当用户手指从拖拽 item 中抬起的时候,我们需要把 item 的透明度复原。需要我们重写 clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) 方法:

  1. @Override
  2. public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
  3. super.clearView(recyclerView, viewHolder);
  4. viewHolder.itemView.setBackgroundColor(0);
  5. }
复制代码

好了,来看看改进之后的效果:

改进效果图

源码下载:TestRV.rar

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持程序员之家。



回复

使用道具 举报