那么有了ListView、GridView为什么还需要RecyclerView这样的控件呢?整体上看RecyclerView架构,提供了一种插拔式的体验,高度的解耦,异常的灵活,通过设置它提供的不同LayoutManager,ItemDecoration , ItemAnimator实现令人瞠目的效果。
- 你想要控制其显示的方式,请通过布局管理器LayoutManager
- 你想要控制Item间的间隔(可绘制),请通过ItemDecoration
- 你想要控制Item增删的动画,请通过ItemAnimator
- 你想要控制点击、长按事件,请自己写(擦,这点尼玛。)
code中需要
//设置布局管理器,必须
mRecyclerView.setLayoutManager(layout);
//设置RecycleView的Adapter,必须
mRecyclerView.setAdapter(adapter)
//设置分割线,非必须
mRecyclerView.addItemDecoration(ItemDecoration);
//设置item的增删动画,非必须
mRecyclerView.setItemAnimator(animator);
现在先最简单创建一个列表
新建Item的布局recycleview_item,以TextView为根节点
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/recycle_textview"
android:layout_width="match_parent"
android:layout_height="50dp"
android:gravity="center"
android:textSize="20sp"/>
新建一个RecyclerView.Adapter适配器TestRecycleViewAdapter
public class TestRecycleViewAdapter extends RecyclerView.Adapter<TestRecycleViewAdapter.ViewHolderA> {
private Context mContext;
private List<String> mList;
public TestRecycleViewAdapter(Context context, List<String> list) {
mContext = context;
mList = list;
}
@Override
public ViewHolderA onCreateViewHolder(ViewGroup parent, int viewType) {
//此处动态加载ViewHolder的布局文件并返回holder
View view = LayoutInflater.from(mContext).inflate(R.layout.recycleview_item, parent, false);
ViewHolderA holderA = new ViewHolderA(view);
return holderA;
}
@Override
public void onBindViewHolder(ViewHolderA holder, int position) {
//此处设置Item中view的数据
holder.mTextView.setText(mList.get(position));
}
@Override
public int getItemCount() {
//生成的item的数量
return mList.size();
}
//Item的ViewHolder以及item内部布局控件的id绑定
class ViewHolderA extends RecyclerView.ViewHolder{
TextView mTextView;
public ViewHolderA(View itemView) {
super(itemView);
mTextView = (TextView) itemView.findViewById(R.id.recycle_textview);
}
}
}
用Android Studio生成Adapter结构技巧
- 先新建一个类TestRecycleViewAdapter
- 继承自RecyclerView.Adapter<这里填ViewHolder名字的>,现在出现红线,先不管它
- 然后在TestRecycleViewAdapter 内部写内部类ViewHolderA 继承自 RecyclerView.ViewHolder,这个时候会自动生成构造函数
- 接着将ViewHolder的名字ViewHolderA填入第2步粗体处,注意这里是内部类所以正确填入是TestRecycleViewAdapter.ViewHolderA
- 接着点红线,然后IDE会自己生成所需的3个方法
Activity中代码是这样
public class MainActivity extends AppCompatActivity {
private List<String> list;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
RecyclerView mRecyclerView = (RecyclerView) findViewById(R.id.activity_main_recycle_view);
mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
initData();
//实例化并传输数据给adapter
TestRecycleViewAdapter adapter = new TestRecycleViewAdapter(getApplicationContext(), list);
mRecyclerView.setAdapter(adapter);
}
/**
* 添加数据
* */
private void initData() {
list = new ArrayList<>();
for (int i = 0; i < 50; i++) {
list.add("item" + i);
}
}
}
这样子一个最基本的RecycleView就写好了,效果图

可以看到默认没有Scrollbars,没有item之间的间隔线,没有item点击效果,实际上这些我们需要自定义(虽然有点麻烦)
ItemDecoration
该方法的参数为RecyclerView.ItemDecoration,该类为抽象类,官方目前并没有提供默认的实现类该类的源码:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
当我们调用mRecyclerView.addItemDecoration()
方法添加decoration的时候,RecyclerView在绘制的时候,去会绘制decorator,即调用该类的onDraw和onDrawOver方法,
- onDraw方法先于drawChildren
- onDrawOver在drawChildren之后,一般我们选择复写其中一个即可。
- getItemOffsets 可以通过outRect.set()为每个Item设置一定的偏移量,主要用于绘制Decorator。
该类参考自:DividerItemDecoration
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
所以,自定义间隔线步骤如下:
在Style文件里加上name="android:listDivider"的item
<item name="android:listDivider">@drawable/divider_backgroud</item>
书写divider_bg.xml文件,shape文件为渐变xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:centerColor="#b3b35f"
android:endColor="#515187"
android:startColor="#b34747"
android:type="linear" />
<size android:height="5dp"/>
</shape>
这样一个自定义间隔线样式就好了

LayoutManager
好了,上面实现了类似ListView样子的Demo,通过使用其默认的LinearLayoutManager。
RecyclerView.LayoutManager吧,这是一个抽象类,好在系统提供了3个实现类:
- LinearLayoutManager 现行管理器,支持横向、纵向。
- GridLayoutManager 网格布局管理器
- StaggeredGridLayoutManager 瀑布就式布局管理器
我们尝试去实现类似GridView,秒秒钟的事情:
- 1
- 2
- 1
- 2
只需要修改LayoutManager即可,还是很nice的。
瀑布流式的布局,其实他可以实现GridLayoutManager
一样的功能,仅仅按照下列代码:
- 1
- 2
- 1
- 2
这两种写法显示的效果是一致的,但是注意StaggeredGridLayoutManager构造的第二个参数传一个orientation,如果传入的是StaggeredGridLayoutManager.VERTICAL
代表有多少列;那么传入的如果是StaggeredGridLayoutManager.HORIZONTAL
就代表有多少行,比如本例如果改为:
- 1
- 2
- 1
- 2
那么效果为:
感觉上和网格布局没啥差别,因为这上面的item我们使用了固定的高度,我们可以在适配器的onBindViewHolder方法中随机设置item高度
- 先在adapter的里声明
private List<Integer> mHeight;
- 在构造方法里随机生成高度值
mHeight = new ArrayList<Integer>(); for (int i = 0; i < mList.size(); i++) { mHeight.add((int) (80 + Math.random() * 300)); }
- 接着在onBindViewHolder方法里
ViewGroup.LayoutParams lp = holder.mTextView.getLayoutParams(); lp.height = mHeight.get(position);

ItemAnimator
ItemAnimator也是一个抽象类,好在系统为我们提供了一种默认的实现类,期待系统多
添加些默认的实现。
借助默认的实现,当Item添加和移除的时候,添加动画效果很简单:
- 1
- 2
- 1
- 2
系统为我们提供了一个默认的实现,我们为我们的瀑布流添加以上一行代码,效果为:
注意,这里更新数据集不是用adapter.notifyDataSetChanged()
而是
notifyItemInserted(position)
与notifyItemRemoved(position)
否则没有动画效果。
上述为adapter中添加了两个方法:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
Activity中点击MenuItem触发:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
好了,到这我对这个控件已经不是一般的喜欢了~~~
当然了只提供了一种动画,那么我们肯定可以去自定义各种nice的动画效果。高兴的是,github上已经有很多类似的项目了,这里我们直接引用下: RecyclerViewItemAnimators ,大家自己下载查看。
提供了
SlideInOutLeftItemAnimator
,
SlideInOutRightItemAnimator
,
SlideInOutTopItemAnimator
,
SlideInOutBottomItemAnimator
等动画效果。
点击事件:
Click and LongClick
不过一个挺郁闷的地方就是,系统没有提供ClickListener和LongClickListener。
不过我们也可以自己去添加,只是会多了些代码而已。
实现的方式比较多,你可以通过mRecyclerView.addOnItemTouchListener去监听然后去判断手势,
当然你也可以通过adapter中自己去提供回调,这里我们选择后者,前者的方式,大家有兴趣自己去实现。
那么代码也比较简单:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
adapter中自己定义了个接口,然后在onBindViewHolder中去为holder.itemView去设置相应
的监听最后回调我们设置的监听。
最后别忘了给item添加一个drawable:
- 1
- 2
- 3
- 4
- 5
- 6
- 1
- 2
- 3
- 4
- 5
- 6
Activity中去设置监听:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
测试效果:
public void onBindViewHolder(ViewHolderA holder, final int position) {
.....
.....
holder.mTextView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(mContext, "item"+position,Toast.LENGTH_SHORT).show();
}
});
.....
}
与某些View结合使用
- 可以被SwipeRefreshLayout实现Android原生下拉刷新,也可以实现第三方下拉刷新
- item可以使用CardView,恩,超漂亮
滑动监听addOnScrollListener 可实现下拉刷新等
实现这个借口的俩个方法
- onScrollStateChanged
- onScrolled
mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
//标记当前是否向最后一项滑动
boolean isSlidingToLast = false;
@Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
super.onScrollStateChanged(recyclerView, newState);
//获取当前的LayoutManager
LinearLayoutManager manager = (LinearLayoutManager) recyclerView.getLayoutManager();
//当不滚动的时候
if (newState == RecyclerView.SCROLL_STATE_IDLE) {
//得到最后一个完全显示的item的position
int lastViusalItem = manager.findLastCompletelyVisibleItemPosition();
//总的ITemPosition
int totalItemCount = manager.getItemCount();
//当前是否向下滑,是否滚动到LastItem
if (lastViusalItem == (totalItemCount - 1) && isSlidingToLast) {
// 这里就是下拉加载更多功能的逻辑
//往item的List里添加数据,并通知适配器更新
adapter.addListData(lastViusalItem);
}
}
}
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
//如果dy>0则当前向下滑state
if (dy > 0) {
isSlidingToLast = true;
} else if (dy < 0) {
isSlidingToLast = false;
}
}
});
case RecyclerView.SCROLL_STATE_IDLE: //当停止滚动时,当前的recycleView不滑动(滑动已经停止时) break; case RecyclerView.SCROLL_STATE_DRAGGING: //滚动时,当前的recycleView被拖动滑动 //没错,下面这一坨就是隐藏软键盘的代码 //((InputMethodManager)getSystemService(INPUT_METHOD_SERVICE)).hideSoftInputFromWindow(CustomClaimTargetListDetailActivity.this.getCurrentFocus().getWindowToken(), InputMethodManager.HIDE_NOT_ALWAYS); break; case RecyclerView.SCROLL_STATE_SETTLING: //手指抬起,但是屏幕还在滚动状态,当前的recycleView在滚动到某个位置的动画过程,但没有被触摸滚动.调用 scrollToPosition(int) 应该会触发这个状态 break;
adapter里添加
public void addListData(int position){
for (int i = 0; i <6; i++) {
mList.add("底部添加" + i);
}
//通知适配器item内容删除
notifyItemChanged(position);
}
这里的LayoutManager对象manager还可以获取到很多参数,比如

可以用tm来实现更多逻辑功能

ItemTouchHelper实现item删除,互相拉动
一个大神写的
Android实现RecyclerView侧滑删除和长按拖拽-ItemTouchHelper
,讲的很清楚,这里不再详解,贴上测试的代码,仅做记录
在setAdapter后面添加
ItemTouchHelper.Callback mCallback = new ItemTouchHelper.SimpleCallback(ItemTouchHelper.DOWN|ItemTouchHelper.UP, ItemTouchHelper.RIGHT) {
@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(list, i, i+1);
}
}else {
for (int i = fromPosition; i < toPosition; i++) {
// 向上
Collections.swap(list, i, i-1);
}
}
mTestRecycleViewAdapterMulType.notifyItemMoved(fromPosition, toPosition);
//返回true表示执行拖动
return true;
}
@Override
public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) {
int position = viewHolder.getAdapterPosition();
list.remove(position);
mTestRecycleViewAdapterMulType.notifyItemRemoved(position);
}
};
ItemTouchHelper mItemTouchHelper = new ItemTouchHelper(mCallback);
mItemTouchHelper.attachToRecyclerView(mRecyclerView);
效果

RecycleView多种布局显示
先看效果

RecycleView.Adapter也提供了getItemViewType方法,此方法和ListView加载多布局一样。
这里需要注意的是这里的范型不再是自己写的ViewHolder
public class TestRecycleViewAdapterMulType extends RecyclerView.Adapter<RecyclerView.ViewHolder>
重写adapter的getItemViewType
public int getItemViewType(int position) {
if (position == 0) {
//111代表顶部item
return 111;
} else if (position == getItemCount() - 1) {
//111代表di部item
return 112;
}
//111代表中间item
return 110;
}
自定义3个ViewHolder,分别表示top ,bottom 和中间的item布局
/**
* 代表顶部item
*/
class ViewHolderA extends RecyclerView.ViewHolder {
ImageView mImageViewA;
public ViewHolderA(View itemView) {
super(itemView);
mImageViewA = (ImageView) itemView.findViewById(R.id.top_imageview);
}
}
/**
* 代表di部item
*/
class ViewHolderB extends RecyclerView.ViewHolder {
ImageView mImageViewB;
public ViewHolderB(View itemView) {
super(itemView);
mImageViewB = (ImageView) itemView.findViewById(R.id.bottom_imageview);
}
}
/**
* 代表中间item
*/
class ViewHolderC extends RecyclerView.ViewHolder {
TextView mTextView;
public ViewHolderC(View itemView) {
super(itemView);
mTextView = (TextView) itemView.findViewById(R.id.recycle_textview);
}
}
在onCreateViewHolder方法里
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = null;
RecyclerView.ViewHolder holder = null;
//此处动态加载ViewHolder的布局文件并返回holder
switch (viewType) {
case 111:
//111代表顶部item
view = LayoutInflater.from(mContext).inflate(R.layout.top, parent, false);
holder = new ViewHolderA(view);
break;
case 112:
//112代表顶部item
view = LayoutInflater.from(mContext).inflate(R.layout.bottom, parent, false);
holder = new ViewHolderB(view);
break;
case 110:
//112代表中间item
view = LayoutInflater.from(mContext).inflate(R.layout.recycleview_item, parent, false);
holder = new ViewHolderC(view);
break;
}
return holder;
}
最后是onBindViewHolder,在这里分别设置不同布局item数据
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, final int position) {
// //这样写也行
// if(holder instanceof ViewHolderA){
// ViewHolderA holderA = (ViewHolderA) holder;
// holderA.mImageViewA.setImageResource(R.mipmap.ic_launcher);
// }else if(holder instanceof ViewHolderB).....
// .....
switch (getItemViewType(position)) {
case 111:
ViewHolderA holderA = (ViewHolderA) holder;
holderA.mImageViewA.setImageResource(R.mipmap.ic_launcher);
break;
case 112:
ViewHolderB holderB = (ViewHolderB) holder;
holderB.mImageViewB.setImageResource(R.mipmap.ic_launcher);
break;
case 110:
ViewHolderC holderC = (ViewHolderC) holder;
holderC.mTextView.setText(mList.get(position));
break;
}
}
贴一下完整Adapter代码
**
* Created by NIWA on 2017/3/9.
*/
public class TestRecycleViewAdapterMulType extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private Context mContext;
private List<String> mList;
public TestRecycleViewAdapterMulType(Context context, List<String> list) {
mContext = context;
mList = list;
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = null;
RecyclerView.ViewHolder holder = null;
//此处动态加载ViewHolder的布局文件并返回holder
switch (viewType) {
case 111:
//111代表顶部item
view = LayoutInflater.from(mContext).inflate(R.layout.top, parent, false);
holder = new ViewHolderA(view);
break;
case 112:
//112代表顶部item
view = LayoutInflater.from(mContext).inflate(R.layout.bottom, parent, false);
holder = new ViewHolderB(view);
break;
case 110:
//112代表中间item
view = LayoutInflater.from(mContext).inflate(R.layout.recycleview_item, parent, false);
holder = new ViewHolderC(view);
break;
}
return holder;
}
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, final int position) {
// //这样写也行
// if(holder instanceof ViewHolderA){
// ViewHolderA holderA = (ViewHolderA) holder;
// holderA.mImageViewA.setImageResource(R.mipmap.ic_launcher);
// }else if(holder instanceof ViewHolderB).....
// .....
switch (getItemViewType(position)) {
case 111:
ViewHolderA holderA = (ViewHolderA) holder;
holderA.mImageViewA.setImageResource(R.mipmap.ic_launcher);
break;
case 112:
ViewHolderB holderB = (ViewHolderB) holder;
holderB.mImageViewB.setImageResource(R.mipmap.ic_launcher);
break;
case 110:
ViewHolderC holderC = (ViewHolderC) holder;
holderC.mTextView.setText(mList.get(position));
break;
}
}
@Override
public int getItemCount() {
//生成的item的数量
return mList.size();
}
/**
* 代表顶部item
*/
class ViewHolderA extends RecyclerView.ViewHolder {
ImageView mImageViewA;
public ViewHolderA(View itemView) {
super(itemView);
mImageViewA = (ImageView) itemView.findViewById(R.id.top_imageview);
}
}
/**
* 代表di部item
*/
class ViewHolderB extends RecyclerView.ViewHolder {
ImageView mImageViewB;
public ViewHolderB(View itemView) {
super(itemView);
mImageViewB = (ImageView) itemView.findViewById(R.id.bottom_imageview);
}
}
/**
* 代表中间item
*/
class ViewHolderC extends RecyclerView.ViewHolder {
TextView mTextView;
public ViewHolderC(View itemView) {
super(itemView);
mTextView = (TextView) itemView.findViewById(R.id.recycle_textview);
}
}
@Override
public int getItemViewType(int position) {
if (position == 0) {
//111代表顶部item
return 111;
} else if (position == getItemCount() - 1) {
//因为item是从0开始,所以最后一项应该是getItemCount() - 1
//111代表di部item
return 112;
}
//111代表中间item
return 110;
}
}
最后在Activity里
mTestRecycleViewAdapterMulType = new TestRecycleViewAdapterMulType(getApplicationContext(), list);
mRecyclerView.setAdapter(mTestRecycleViewAdapterMulType);
heiheihei
注意
- 刷新数据的几个方法
notifyItemInserted();
notifyItemRangeInserted();
notifyItemChanged();
notifyItemRangeChanged();
notifyItemRemoved();
notifyItemRangeRemoved();
稍作记录,待测试中
开源库XRecycleView
据我所知,支付宝用了这个库
- 用法和原生RecycleView一样
- 封装好了下拉刷新,上拉加载,刷新动画
- 增加头部,甚至增加俩个headerView
本篇完
参考文章: http://www.jianshu.com/p/c35ca003654d