引言

  CardView是Android 5.0系统之后引入的众多控件之一,实现之后的效果也是比较酷的,它经常被用在RecyclerView和ListView中的Item中。今天我们就来了解一下CardView的属性,然后使用CardView和RecyclerView结合实现一个可以拖拽Item的布局。

CardView的属性

   CardView继承自FrameLayout,所以子控件的布局规则和FrameLayout的一样,是按照层次堆叠的
下面是CardView的一些常用属性:

CardView的基本使用

先看一下效果:


图1.CardView的基本使用

这是一个CardView,多个罗列起来看起啦会更酷,好了,我们先看一下代码:

看完了布局文件,是不是觉得这个布局不仅炫酷而且使用简单,下面我们把它应用到RecyclerView中,看起来会更炫酷。

CardView应用在RecyclerView中

  CardView通常会应用在RecyclerView和ListView中,今天我们就讲一讲如何应用在RecyclerView中。我们现在在大多数应用或者手机系统界面中会见到这样的效果:


图2.

是不是觉得很棒,下面我们就用CardView和RecyclerView来实现一下这个效果。

布局文件

  我们实现这个效果的第一步是先添加依赖库:

  然后写一下布局文件,Item的布局文件我就直接采用上面的代码了,然后再写一个主界面的布局文件,比较简单,如下:

Activity内代码

好了,这就是一个没有任何效果的列表界面,我一看一下效果:


图3.列表界面

ItemTouchHelper

  想实现拖拽和滑动删除的效果,很可惜RecyclerView并没有提供现成的API供我们使用,但是SDK为我们提供了ItemTouchHelper这样一个工具类帮助我们来轻松实现这些功能,我们先来了解一下ItemTouchHelper。官方文档是这样介绍的:

This is a utility class to add swipe to dismiss and drag & drop support to RecyclerView.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.Depending on which functionality you support, you should override onMove(RecyclerView, ViewHolder, ViewHolder) and / or onSwiped(ViewHolder, int).

大致意思就是,这是个工具类,可以实拖拽移动和策划删除,使用这个工具需要RecyclerView和Callback。同时需要重写onMove()和onSwiped()方法。接下来就讲讲如何使用ItemTouchHlper。

1.新建一个接口,并且让Adapter实现

  我们选择使用一个接口来实现Adapter和ItemTouchHelper之间涉及数据的操作,因为ItemTouchHelper完成触摸的各种动画以后,就要对Adapter的数据进行操作,比如我们在侧滑删除以后,最后需要调用Adapter的notifyItemRemove()方法来移除该数据。所以我们可以把数据操作的部分抽象成一个接口方法,让Callbac调用它即可。具体如下:

新建一个接口:

ItemTouchHelperAdapter

之后让Adapter实现这个接口

接下来我们直接在Callback中直接调用接口里的方法就可以了。

2.新建Callback方法,继承ItemTouchHelper.Callback

  官方文档已经告诉我们,使用ItemTouchHelper需要一个Callback,这个Callback是ItemTouchHelper.Callback的子类,我们需要新建一个类来继承ItemTouchHelper.Callback,然后重写一些方法来实现我们的需求。代码如下:

ItemTouchHelper.Callback还有其他几个常用方法:

  • public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState):从静止状态变为拖拽或者滑动的时候会调用该方法,参数actionState表示当前状态。
  • public void clearView(RecyclerView recyclerView, ViewHolder viewHolder):当用户操作完某个item并且动画也结束后会调用该方法,一般我们在该方法内恢复ItemView的初始状态,防止由于复用而产生的错乱问题。
  • public void onChildDraw(…):我们可以在这个方法内实现我们自定义的交互规则或者自定义动画。

这样下来我们就只剩下一步了。

3.为RecyclerView添加ItemTouchHelper

代码如下:

这样,我们就实现了我们的需求,我们一起来看看效果:


图4.拖拽和左滑删除

  好了,我们的需求完成了,效果是不是很炫酷,当然大家可以根据自己的需求做出更炫酷的效果,到时候别忘了与大家一起分享。最后欢迎指正,感谢阅读。

发表评论

电子邮件地址不会被公开。 必填项已用*标注