可拖拽排序的GridView(基于RecyclerView实现)

简介

 具有拖拽效果的GridView是一个很常见的效果，例如发微博时的选择图片的九宫格，资讯类频道的编辑排序。目前市面上常见的大多数基于GridView重写onTouchEvent触摸事件的处理。但实现起来代码量较大，后期维护成本比较高。如今RecyclerView的使用已经相当普及了，今天鄙人提供一个使用RecyclerView实现的版本，使用RecyclerView自带的动画效果，后期维护成本相较于GridView还是比较小的。源码请戳：基于RecycleView实现的可拖拽九宫格 欢迎大家star，给我提bug。

源码解析

解析了你们又不看，解析干啥。有啥问题欢迎大家给我留言。

 

 

 

 

 

关键的地方是ItemTouchHelper ，如果我们按照平常的写法RecylerView item的滑动是不会跳出RecylerView的控件范围的。因此需要重写ItemTouchHelper.Callback() 中的方法实现想要的效果

复写getBoundingBoxMargin（）方法 使得item滑动范围不再受RecylerView的限制。原因是因为ItemTouchHelper#findSwapTargets方法中使用getBoundingBoxMargin计算item的可滑动范围

复写onChildDraw（）方法 在该方法中计算父布局中的Bitmap的具体位置，这里有个坑，看似直接取viewHolder.itemView.getX即可实际上不可以 需要手动计算一下当前item滑动到的坐标，代码如下

// 看似直接取viewHolder.itemView.getX即可
// 但在ItemtouchHelper中getSelectedDxDy可见dX不恒等于translationX 因此需要手动计算
val itemViewX = viewHolder.itemView.left + dX
val itemViewY = viewHolder.itemView.top + dY
recyclerView.getLocationInWindow(ints)
//将Bitmap和位置交给顶层View绘制
mDragingBitmap?.let {
    drawBitmap(
        it, itemViewX, itemViewY,
        recyclerView.x, recyclerView.y
    )
}

大家知道 这种九宫格RecyclerView的范围不会全屏，那么想要实现拖到RecylerView范围外也可以显示图片。就需要做些特殊处理。相信看过仿QQ红点拖拽消失的同学们知道。可以在顶层布局实例化一个全屏透明布局做文章。这样做的好处是解耦复用性好，Cloud9中也实现了这种方式的实现 。