进击的RecyclerView入门三（要是能拖动就好了）

还是接着上一讲“进击的RecyclerView入门二（来点小装饰？）”，在上一讲中我们学到了怎么给不同的Item定制不同的外观，但貌似那个蓝色的框实在太丑了，咱还是把它干了吧。

@Override
public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) {
      //太丑了，这段还是注释掉吧
//            for (int i = 0; i < parent.getChildCount(); i++) {
//                if ((i - 1) % 3 == 0) {
//                    View child = parent.getChildAt(i);
//                    RecyclerView.LayoutParams rLP = (RecyclerView.LayoutParams) child.getLayoutParams();
//                    int left = child.getLeft();
//                    int top = child.getTop();
//                    int right = child.getRight();
//                    int bottom = child.getBottom();
//                    c.drawRect(left, top, right, bottom, paint);
//                }
//            }
}

把那个碍眼的蓝色去掉以后就来认识一下我们今天的主角ItemTouchHelper,从名字上就可以看出它是与视图的触摸相关的，还是国际惯例看一下官方文档的定义：

This is a utility class to add swipe to dismiss and drag & drop support to RecyclerView.

简单讲这个类是用来帮助处理RecyclerView子View的拖拽放置和滑动删除的。

It works with a RecyclerView and a Callback class, which configures what type of interactions are enabled and also receives events when user performs these actions.

从上面这段可以知道ItemTouchHelper工作还需要RecyclerView和Callback来配合，那么这里的Callback是什么角色呢？

其实这里的Callback是ItemTouchHelper的一个子类，它的介绍如下：

This class is the contract between ItemTouchHelper and your application. It lets you control which touch behaviors are enabled per each ViewHolder and also receive callbacks when user performs these actions.

意思是说这个类是用来建立ItemTouchHelper和我们应用之间的桥梁的，它可以控制哪些触摸事件可用哪些不可用，还可以接受到这些事件的回调。

总而言之，要实现RecyclerView的拖拽放置和滑动删除需要以下三个类的配合：

• RecyclerView
• ItemTouchHelper
• ItemTouchHelper.Callback

在看ItemTouchHelper.Callback的文档的时候发现它有一个子类ItemTouchHelper.SimpleCallback，似乎又啥猫腻，我们来看看：

A simple wrapper to the default Callback which you can construct with drag and swipe directions and this class will handle the flag callbacks. You should still override onMove or onSwiped depending on your use case.

它是对Callback的一个简单包装，它可以让你自由的通过不同的方向来构建拖拽放置或滑动，并处理这些回调，同时我们自需根据自身需求实现onMove或onSwiped即可。

另外文档中还给了一个小例子：

ItemTouchHelper mIth = new ItemTouchHelper(
    new ItemTouchHelper.SimpleCallback(ItemTouchHelper.UP | ItemTouchHelper.DOWN,
        ItemTouchHelper.LEFT) {
        public abstract boolean onMove(RecyclerView recyclerView,
            ViewHolder viewHolder, ViewHolder target) {
            final int fromPos = viewHolder.getAdapterPosition();
            final int toPos = viewHolder.getAdapterPosition();
            // move item in `fromPos` to `toPos` in adapter.
            return true;// true if moved, false otherwise
        }
        public void onSwiped(ViewHolder viewHolder, int direction) {
            // remove from adapter
        }
});

那么接下来我们就来看看具体怎么码代码？

首先准备SimpleCallback：

private ItemTouchHelper.SimpleCallback simpleCallback = new ItemTouchHelper.SimpleCallback(ItemTouchHelper.LEFT
           | ItemTouchHelper.DOWN
           | ItemTouchHelper.RIGHT
           | ItemTouchHelper.UP
           , ItemTouchHelper.ACTION_STATE_IDLE)

这里构造方法两个参数的意思是，拖拽支持上下左右，滑动删除不支持。我们这里的网格布局，滑动删除不适合这里。

接着重写如下方法：

@Override
       public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
           //获得两个Item的位置
           int originPosition = viewHolder.getAdapterPosition();
           int targetPistion = target.getAdapterPosition();
           //交换Adapter中对应的位置
           MyAdapter adapter = (MyAdapter) recyclerView.getAdapter();
           adapter.move(originPosition, targetPistion);
           return true;
       }

上面这段代码是拖拽的回调，viewHolder是用户拖拽的Item，target用户想要放置位置的Item。接着我们获得这两个Item对应在Adapter中的位置，并通知adapter去跟新数据。如下图，是将位置5的item往位置0进行拖拽：

界面上已经有所改变了，但要真正改变这两个Item的位置需要去改变他们在adapter中的位置。

在MyAdapter中增加如下方法：

        public void move(int origin, int target) {
            Collections.swap(datas, origin, target);
            if (origin < target) {
                for (int i = origin; i < target; i++) {
                    Collections.swap(datas, i, i + 1);
                }
            }
            if (origin > target) {
                for (int i = origin; i > target; i--) {
                    Collections.swap(datas, i, i - 1);
                }
            }
            notifyItemMoved(origin, target);
        }

这里元素的位置调换需要与界面上的一致，不过多赘述。

在上面的那张动图中可以看到被拖拽的Item有放大和缩小的动画效果，这个并不是ItemTouchHelper自带的效果，需要我们自己实现，这里需要重写simpleCallback的onSelectedChanged方法：

@Override
public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
    super.onSelectedChanged(viewHolder, actionState);
    if(actionState == ItemTouchHelper.ACTION_STATE_DRAG){
        Log.d("scott","drag");
        ObjectAnimator objectAnimatorX = ObjectAnimator.ofFloat(viewHolder.itemView, "scaleX", 1.0f, 1.2f);
        ObjectAnimator objectAnimatorY = ObjectAnimator.ofFloat(viewHolder.itemView, "scaleY", 1.0f, 1.2f);
        AnimatorSet animatorSet = new AnimatorSet();
        animatorSet.setDuration(300);
        animatorSet.playTogether(objectAnimatorX, objectAnimatorY);
        animatorSet.start();
        view = viewHolder.itemView;
    }
    if(actionState == ItemTouchHelper.ACTION_STATE_IDLE){
        ObjectAnimator objectAnimatorX = ObjectAnimator.ofFloat(view, "scaleX", 1.2f, 1.0f);
        ObjectAnimator objectAnimatorY = ObjectAnimator.ofFloat(view, "scaleY", 1.2f, 1.0f);
        AnimatorSet animatorSet = new AnimatorSet();
        animatorSet.setDuration(300);
        animatorSet.playTogether(objectAnimatorX, objectAnimatorY);
        animatorSet.start();
    }
}

以上准备工作做完后就需要将ItemTouchHelper,SimpleCallback,RecyclerView三者关联起来：

ItemTouchHelper itemTouchHelper = new ItemTouchHelper(simpleCallback);
        itemTouchHelper.attachToRecyclerView(recyclerView);

OK，差不多就这么多了，更详细代码请参考：

demo完整源码地址：

https://github.com/ZhangQinglian/RecyclerViewAdvance