使用RecylerView完成拖动排序，仿qq侧滑删除

最新推荐文章于 2024-05-08 14:52:01 发布

Coder-Sure

最新推荐文章于 2024-05-08 14:52:01 发布

阅读量987

点赞数 2

分类专栏： Android开发文章标签：仿qq侧滑拖动排序 android

本文链接：https://blog.csdn.net/u012846101/article/details/52835847

版权

Android开发专栏收录该内容

4 篇文章 0 订阅

订阅专栏

 
 最近使用到Recylerview完成拖动排序，侧滑删除，在此记录一下。 

  需要使用到： 
 ItemTouchHelper.Callback这个类。 

  效果图： 

  在有RecylerView的Activity中，除了设置Adapter还需要做的事情有： 

MyItemTouchHelperCallback callback = new MyItemTouchHelperCallback(adapter); //此类继承ItemTouchHelper.Callback,这是帮助处理RecylerView拖动侧滑操作的辅助类 
ItemTouchHelper helper = new ItemTouchHelper(callback); //用上面实例化的callback实例化一个ItemTouchHelper对象。套路代码，没啥好说的，固定做法 
helper.attachToRecyclerView(recyclerView); //让help帮助处理recylerview的滑动，侧滑操作

  Activity中的操作就这么简单。 

  接下来定义一个接口，这个接口是为了解除耦合，因为我看到有一些文章在activity中处理了onMove和onSwipe，抽象出来更好理解。 

public interface OnMoveAndSwipeListener {    
	public boolean onItemMove(int fromPosition, int toPosition); //注意返回boolean哦    
	public void onItemDismiss(int position);
}

  在RecylerView的Adapter中实现此接口， 

  复写上面的两个方法， 

    @Override
    public boolean onItemMove(int fromPosition, int toPosition) {
        if (fromPosition < toPosition) {
            //往下移动时,做数据交换
            for (int i = fromPosition; i < toPosition; i++) {
                Collections.swap(list,i,i+1);
            }
        }else{
            //往上移动,做数据交换
            for (int i = fromPosition; i >toPosition ; i--) {
                Collections.swap(list,i,i-1);
            }
        }
        notifyItemMoved(fromPosition,toPosition);
        return true;
    }

    @Override
    public void onItemDismiss(int position) {
        //此例没有对侧滑做操作，如果需要就在此模仿onItemMove方法，删除对应位置的数据，并且刷新界面就可以了
    }

  这样Adapter的工作也就完成了，一样也很简单，都有固定的套路，注意大家看到的demo都是有个默认的动画，这个动画效果是你在设置RecylerView时， 
 recylerview.setItemAnimator（参数）；设置进去的，如果你没有调用此方法，则就是默认动画效果。 

  除了设置Adapter还需要做的事情有： 

 
 写一个类继承ItemTouchHelper.Callback， 

  这就是最后一步了，也是本文最开始在Activity中实例化的类， 

  代码也不多： 

public class MyItemTouchHelperCallback extends ItemTouchHelper.Callback {

    MyAdapter adapter;

    public MyItemTouchHelperCallback(MyAdapter adapter) {
        this.adapter = adapter;
    }

    @Override
    public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
        //复写此方法用来设置我需要处理哪些操作
        //我要处理上下拖动，就设置up down，如果是gridview类型的recylerview，up,down,left,right都可以处理
        final int moveMode = ItemTouchHelper.UP | ItemTouchHelper.DOWN;
        //本例没有处理侧滑，如果需要处理侧滑，就把注释取消掉
        //final int swipeMode = ItemTouchHelper.START | ItemTouchHelper.END;
        Log.e("getMovementFlags","getMovementFlags");
        return makeMovementFlags(moveMode, 0);//不处理什么，就传0
    }

    @Override
    public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
        //当你拖动时就会触发此回调，然后调用在adapter中复写的onItemMove方法，去交换数据
        return adapter.onItemMove(viewHolder.getAdapterPosition(),target.getAdapterPosition());
    }

    @Override
    public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
        //如果你要处理侧滑就取消注释，逻辑和上面的onMove一样
        // adapter.onItemDismiss(viewHolder.getAdapterPosition());
    }

    @Override
    public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
        //此方法在你选中一个item拖动时触发，所以你可以在这里给选中的item设置一个背景色，用于高亮提示你选中了这个背景色
        super.onSelectedChanged(viewHolder, actionState);
        if (actionState!= ItemTouchHelper.ACTION_STATE_IDLE){
            viewHolder.itemView.setBackgroundColor(Color.LTGRAY);
        }

    }

    @Override
    public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
        //因为你设置了背景色，所以在你不选中的时候，要取消掉这个背景色。
        super.clearView(recyclerView, viewHolder);
        viewHolder.itemView.setBackgroundColor(0);

    }



}

  到此为止，一个简单的拖动和侧滑就完成了，其实拖动和侧滑的逻辑都是一样的，按着上面的步骤来，效果就出来了。 

  上面只是一个简单的效果。把上面的效果实现了，接下来看更进阶一点的效果： 

 
 要做到上述的效果，先说一下上面的逻辑： 

  首先他的每个Item的布局是两层： 

<?xml version="1.0" encoding="utf-8"?>
<!--背景view，用于提示用户操作结果-->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rl_background"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/iv_done"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_marginLeft="16dp"
        android:layout_marginStart="16dp"
        android:src="@mipmap/bt_ic_done_white_24" />

    <ImageView
        android:id="@+id/iv_schedule"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:src="@mipmap/bt_ic_schedule_white_24" />

    <!--滑动操作的view-->
    <LinearLayout
        android:id="@+id/ll_item"
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:background="@android:color/white"
        android:gravity="center_vertical"
        android:orientation="vertical"
        android:paddingLeft="16dp"
        android:paddingRight="16dp">

        <TextView
            android:id="@+id/tv_item"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            tools:text="Item" />

    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_below="@id/ll_item"
        android:background="#B2B2b2" />

</RelativeLayout>

原理：全屏的linearlayout负责侧滑效果，而根布局是有颜色有图片的那一层，因为linearlayout被滑走了，所以根布局以及上面的图片就出来了。

  需要在MyItemTouchHelperCallback中重新复写的几个方法，以及多复写的几个方法： 

<span style="white-space:pre">	</span>   @Override
            public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
                // 释放View时回调，清除背景颜色，隐藏图标
                // 默认是操作ViewHolder的itemView，这里调用ItemTouchUIUtil的clearView方法传入指定的view
                getDefaultUIUtil().clearView(((SampleAdapter.ItemViewHolder) viewHolder).vItem);
                ((SampleAdapter.ItemViewHolder) viewHolder).vBackground.setBackgroundColor(Color.TRANSPARENT);
                ((SampleAdapter.ItemViewHolder) viewHolder).ivSchedule.setVisibility(View.GONE);
                ((SampleAdapter.ItemViewHolder) viewHolder).ivDone.setVisibility(View.GONE);
            }

            @Override
            public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
                // 当viewHolder的滑动或拖拽状态改变时回调
                if (viewHolder != null) {
                    // 默认是操作ViewHolder的itemView，这里调用ItemTouchUIUtil的clearView方法传入指定的view
                    getDefaultUIUtil().onSelected(((SampleAdapter.ItemViewHolder) viewHolder).vItem);
                }
            }

            @Override
            public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {
                // ItemTouchHelper的onDraw方法会调用该方法，可以使用Canvas对象进行绘制，绘制的图案会在RecyclerView的下方
                // 默认是操作ViewHolder的itemView，这里调用ItemTouchUIUtil的clearView方法传入指定的view
                getDefaultUIUtil().onDraw(c, recyclerView, ((SampleAdapter.ItemViewHolder) viewHolder).vItem, dX, dY, actionState, isCurrentlyActive);
                if (dX > 0) { // 向左滑动是的提示
                    ((SampleAdapter.ItemViewHolder) viewHolder).vBackground.setBackgroundResource(R.color.colorDone);
                    ((SampleAdapter.ItemViewHolder) viewHolder).ivDone.setVisibility(View.VISIBLE);
                    ((SampleAdapter.ItemViewHolder) viewHolder).ivSchedule.setVisibility(View.GONE);
                }
                if (dX < 0) { // 向右滑动时的提示
                    ((SampleAdapter.ItemViewHolder) viewHolder).vBackground.setBackgroundResource(R.color.colorSchedule);
                    ((SampleAdapter.ItemViewHolder) viewHolder).ivSchedule.setVisibility(View.VISIBLE);
                    ((SampleAdapter.ItemViewHolder) viewHolder).ivDone.setVisibility(View.GONE);
                }
            }

            @Override
            public void onChildDrawOver(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) {
                // ItemTouchHelper的onDrawOver方法会调用该方法，可以使用Canvas对象进行绘制，绘制的图案会在RecyclerView的上方
                // 默认是操作ViewHolder的itemView，这里调用ItemTouchUIUtil的clearView方法传入指定的view
                getDefaultUIUtil().onDrawOver(c, recyclerView, ((SampleAdapter.ItemViewHolder) viewHolder).vItem, dX, dY, actionState, isCurrentlyActive);
            }
        });

 
  用getDefaultUIUtil()的方法指定滑动操作的是linearlayout，所以每次被滑走的只有linearlayout。其他的操作都是一样的。 
 

Coder-Sure

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
2
评论
使用RecylerView完成拖动排序，仿qq侧滑删除

最近使用到Recylerview完成拖动排序，侧滑删除，在此记录一下。需要使用到：在有RecylerView的Activity中，除了设置Adapter还需要做的事情有： MyItemTouchHelperCallback callback = new MyItemTouchHelperCallback(adapter); //此类继承ItemTouchHelper
复制链接

扫一扫