android开发游记:ItemTouchHelper 使用RecyclerView打造可拖拽的GridView

以下是RecyclerView结合ItemTouchHelper实现的列表和网格布局的拖拽效果。

效果图例如以下:(gif图有点顿卡,事实上执行是非常流畅的)

demo下载地址:

DragRecyclerView

怎样实现

那么是怎样实现的呢?主要就要使用到ItemTouchHelper ,ItemTouchHelper 是support-v7包中加入的一个帮助开发人员处理拖拽和滑动的实现类,它能够让你非常easy实现側滑删除、拖拽的功能。

我们仅仅须要实例化一个ItemTouchHelper。然后关联到RecyclerView就OK了:

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

构造方法中须要一个ItemTouchHelper.Callback。ItemTouchHelper会在拖拽或剔除的时候回调Callback中对应的方法,我们仅仅需在Callback中实现自己的逻辑就能够了。

自己定义一个类继承实现ItemTouchHelper.Callback接口,须要实现以下方法:

     @Override
    public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
    }

    @Override
    public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
    }

    @Override
    public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
    }

getMovementFlags用于设置是否处理拖拽事件和滑动事件。以及拖拽和滑动操作的方向,比方假设是列表类型的RecyclerView,拖拽仅仅有UP、DOWN两个方向,而假设是网格类型的则有UP、DOWN、LEFT、RIGHT四个方向:

    @Override
    public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
        if (recyclerView.getLayoutManager() instanceof GridLayoutManager) {
            final int dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN | ItemTouchHelper.LEFT | ItemTouchHelper.RIGHT;
            final int swipeFlags = 0;
        } else {
            final int dragFlags = ItemTouchHelper.UP | ItemTouchHelper.DOWN;
            final int swipeFlags = 0;
        }
        return makeMovementFlags(dragFlags, swipeFlags);
    }

dragFlags 是拖拽标志,swipeFlags是滑动标志,我们把swipeFlags 都设置为0,表示不处理滑动操作。

假设我们设置了非0的dragFlags 。那么当我们长按item的时候就会进入拖拽并在拖拽过程中不断回调onMove()方法,我们就在这种方法里获取当前拖拽的item和已经被拖拽到所处位置的item的ViewHolder。有了这2个ViewHolder。我们就能够交换他们的数据集并调用Adapter的notifyItemMoved方法来刷新item。

@Override
public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) {
      int fromPosition = viewHolder.getAdapterPosition();//得到拖动ViewHolder的position
      int toPosition = target.getAdapterPosition();//得到目标ViewHolder的position
      if (fromPosition < toPosition) {
          for (int i = fromPosition; i < toPosition; i++) {
              Collections.swap(results, i, i + 1);
          }
      } else {
          for (int i = fromPosition; i > toPosition; i--) {
              Collections.swap(results, i, i - 1);
          }
      }
      adapter.notifyItemMoved(fromPosition, toPosition);
      return true;
}

同理假设我们设置了非0的swipeFlags。我们在滑动item的时候就会回调onSwiped的方法,我们不处理这个事件,空着即可了。

到这里。已经能够拖拽了。可是拖拽的时候我们拖拽的对象不能高亮显示。这是不友好的。我们希望拖拽的Item在拖拽的过程中背景颜色加深,这样就须要继续重写以下两个方法:

    //当长按选中item的时候(拖拽開始的时候)调用
    @Override
    public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
    }

    //当手指松开的时候(拖拽完毕的时候)调用
    @Override
    public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
    }

我们在開始拖拽的时候给item加入一个背景色,然后在拖拽完毕的时候还原:

    @Override
    public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) {
        if (actionState != ItemTouchHelper.ACTION_STATE_IDLE) {
            viewHolder.itemView.setBackgroundColor(Color.LTGRAY);
        }
        super.onSelectedChanged(viewHolder, actionState);
    }

    @Override
    public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) {
        super.clearView(recyclerView, viewHolder);
        viewHolder.itemView.setBackgroundColor(0);
    }

OK,这样就完毕了一个可拖拽的GridView。

更加复杂的需求

上面的代码完毕了基本功能,但实际的产品须要往往可能会有些不一样,比方说,产品希望,有一些item能够拖拽。一些item无法拖拽,就如上图的“很多其它”是无法拖拽的。

这个咋办呢?

事实上在上面我们实现的Callback类中有一个方法我们没有重写:

    @Override
    public boolean isLongPressDragEnabled() {
        return true;
    }

这种方法是为了告诉ItemTouchHelper是否须要RecyclerView支持长按拖拽,默认返回是ture(即支持),理所当然我们要支持,所以我们没有重写,由于默认true。可是这样做是默认所有的item都能够拖拽。怎么实现部分item拖拽呢,查阅isLongPressDragEnabled方法的源代码发现。上面的凝视上写着:

Default value returns true but you may want to disable this if you want to start

dragging on a custom view touch using {@link #startDrag(ViewHolder)}.

意思是假设你想自己定义触摸view。那么就使用startDrag(ViewHolder)方法。

原来如此,我们能够在item的长按事件中得到当前item的ViewHolder 。然后调用ItemTouchHelper.startDrag(ViewHolder vh)就能够实现拖拽了,那就这么办:

首先我们重写isLongPressDragEnabled返回false,我们要自己调用拖拽过程:

    @Override
    public boolean isLongPressDragEnabled() {
        return false;
    }

接着我们给RecyclerView加入item长按事件。推断item是否是最后一个(最后一个是“很多其它”),不是则開始拖拽。

可是,我们都知道RecyclerView并没有提供OnItemLongClickListener。这个问题我在上一篇博客中已经完美地攻克了,就是使用OnItemTouchListener。然后识别触摸手势,这里给上传送门:RecyclerView无法加入onItemClickListener最佳的高效解决方式,后面我就直接使用上一篇的成果。不反复讲了:

recyclerView.addOnItemTouchListener(new OnRecyclerItemClickListener(recyclerView) {
    //item 长点击事件
    @Override
    public void onLongClick(RecyclerView.ViewHolder vh) {
        //假设item不是最后一个,则执行拖拽
        if (vh.getLayoutPosition()!=results.size()-1) {
            itemTouchHelper.startDrag(vh);
        }
    }
    //item 点击事件
    @Override
    public void onItemClick(RecyclerView.ViewHolder vh) {
    }
});

OK,大功告成。

额外的功能

保存位置

关闭页面以后再打开,又恢复到了初始化的位置,所以就须要保存调整的位置到本地,下次初始化的时候读取位置。

保存位置应该由开发人员自己实现。由于每一个人本地化数据的方式都不一样,我这里做一个简单的实现。使用了开源的ACache类,两个方法,搞定:

//读取
ACache.get(context).getAsObject("items");
//存储
ACache.get(context).put("items",results);

在clearView方法(拖拽完毕)中调用存储方法,在页面初始化数据是调用读取方法。

详见demo

開始拖拽时震动

支付宝的拖拽网格在长按后開始拖拽时会有一次短时间的震动提示用户開始拖拽了,非常友好的交互。我们也加一个:

加入权限:

<uses-permission android:name="android.permission.VIBRATE" />

在開始拖拽时加入以下代码:

//获取系统震动服务
Vibrator vib = (Vibrator) activity.getSystemService(Service.VIBRATOR_SERVICE);
//震动70毫秒
vib.vibrate(70);

详见demo,demo下载地址:

DragRecyclerView

原文地址:https://www.cnblogs.com/llguanli/p/8438205.html

时间: 2024-10-10 17:10:57

android开发游记:ItemTouchHelper 使用RecyclerView打造可拖拽的GridView的相关文章

Android开发学习之路-RecyclerView滑动删除和拖动排序

Android开发学习之路-RecyclerView使用初探 Android开发学习之路-RecyclerView的Item自定义动画及DefaultItemAnimator源码分析 Android开发学习之路-下拉刷新怎么做? 本篇是接着上面三篇之后的一个对RecyclerView的介绍,这里多说两句,如果你还在使用ListView的话,可以放弃掉ListView了.RecyclerView自动帮我们缓存Item视图(ViewHolder),允许我们自定义各种动作的动画和分割线,允许我们对It

JS打造的拖拽翻页效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

android开发游记:SpringView 下拉刷新的高效解决方案,定制你自己风格的拖拽页面

关于下拉刷新/上拉加载更多的解决方案网上已经有很多了,浏览了目前主流的下拉控件比如PullToRefresh库等,第一:大多数实现库都难以进行动画和样式的自定义.第二:不能很好的兼容多种滚动控件,它们都对listView.RecyclerView等进行了不同程度的重新实现,你在项目中就得使用库提供的PullToRefreshListView.PullToRefreshRecyclerView等来代替源生的listView.RecyclerView等,这样的方式其实并不好,随着android版本的

Android开发之自定义View专题(三):自定义GridView

gridview作为android开发中常用的组件,其功能十分强大.但是,我们有时候有很多特殊的需求,需要在其基础上进行改造.有时候会有移动gridView中item位置的需求,这个网上已经有很多例子,博主就不在描述.今天博主讲的是移动gridView中item中的内容.博主没看过网上那些移动item位置的demo,不知道其原理是不是和博主想的一样.博主思考过,似乎博主的这种实现原理似乎也可以用作实现移动item位置.而之前博主百思不得其解的小米手机的桌面的自定义乱序排放,似乎也可以用这个原理去

Android自定义控件:类QQ未读消息拖拽效果

QQ的未读消息,算是一个比较好玩的效果,趁着最近时间比较多,参考了网上的一些资料之后,本次实现一个仿照QQ未读消息的拖拽小红点,最终完成效果如下: 首先我们从最基本的原理开始分析,看一张图: 这个图该怎么绘制呢?实际上我们这里是先绘制两个圆,然后将两个圆的切点通过贝塞尔曲线连接起来就达到这个效果了.至于贝塞尔曲线的概念,这里就不多做解释了,百度一下就知道了. 切点怎么算呢,这里我们稍微复习一些初中的数学知识.看了这个图之后,求出四个切点应该是轻而易举了. 现在思路已经很清晰了,按照我们的思路,开

Android开发游记:RecycleView 实现复杂首页布局三种方式

做过电商类应用的朋友可能都会遇到一个比较头疼的问题:复杂的首页布局如何实现.参考百度糯米,美团,bilibili等应用,都会发现其首页的布局相对复杂,例如下图bilibili的首页(第二张是demo实现的效果图),可以看到在同一个页面中先是有列表布局出现,然后出现了2列的网格布局,接着3列的网格布局,最后还出现了瀑布流式布局: 这样的效果该怎么做呢?是使用LinearLayoutManager.GridLayoutManager还是StaggeredGridLayoutManager?还是根本不

android开发游记:VectorDrawable矢量图兼容性问题的解决方案

安卓5.0Lollipop发布以来VectorDrawable作为安卓环境下的矢量化图形的方式一直由于兼容性问题而很少被用到,由于只能用于5.0以上系统,导致现在多少安卓机无法使用而一直被开发人员无限搁置.在官方给出兼容性的解决方案之前,开发者社区已经有几个解决方案了.比如: https://github.com/trello/victor https://github.com/telly/MrVector https://github.com/wnafee/vector-compat 但是就效

android开发游记:meterial design 5.0 开源控件整套合集 及使用demo

android 的5.0发布不光google官方给出了一些新控件,同时还给出了一套符合material design风格的设计标准,这套标准将未来将覆盖google所有产品包括pc端,网站,移动端.在android端上陆续出现了许多开源的控件库开始以google的以 material design为指导而设计的新风格控件库,对比了多个库之后这里推荐一套比较齐全且效果比较好的控件库,使用方法和传统控件高度一致,并向下兼容,附上使用方式和demo下载. 效果图: 这是由rey5137发布的mater

WEB前端开发学习----11. JQuery 实现简单的拖拽效果

拖拽效果在网页中很常见.实现起来也不难.记录一下今天实现的简单效果. 拖拽演示 快速拖动时,会出现问题,以后修改. 说白了,就是3个点击事件. 1. 按下鼠标左键, 触发点击事件,此时记录下可以得到鼠标相对于拖动控件的位置(当前鼠标位置-控件位置): 2. 拖动鼠标,触发移动事件,可以计算出鼠标移动的距离(当前鼠标位置-之前算出的相对位置),也就是拖拽控件所移动的距离: 3. 鼠标抬起,结束拖动. 在JQ中,event.pageX    event.pageY可以获取鼠标的位置,相对于文档左上角