一、RechclerView简介。
RecyclerView比listview更先进更灵活,对于很多的视图它就是一个容器,可以有效的重用和滚动。
1.可以通过设置LayoutManager可以实现Listview和横向Listview,GridView,横向Gridview和瀑布流等效果。
2.可以通过addItemDecoration添加Item分割线。
3.可以通过setItemAnimator()设置Item的增加和移除动画。
二、RecyclerView相关类介绍。
1、RecyclerView.Adapter:负责托管数据集,为每一项Item创建布局并绑定数据。
2、RecyclerView.ItemDecoration,给Item添加分割线。需要继承该类自定义一个类。
3、RecyclerView.ItemAnimator负责处理Item增加或删除时的动画效果,系统提供了一个默认的动画类DefaultItemAnimator()。
4、RecyclerView.ViewHolder:负责承载Item视图的子布局。
5、RecyclerView.LayoutManager:布局管理器,负责Item视图的布局的显示管理。分为:
(1)、LinearLayoutManager,类似Listview
他有两个构造函数:
LinearLayoutManager(Context context)//默认方向为垂直方向。
LinearLayoutManager(Context context, int orientation, boolean reverseLayout)
其中第二个参数orientation表示布局的方向,可以取两个值:垂直和水平。分别是纵向Listview的效果和横向Listview的效果。第三个参数reverseLayout表示是否反向布局(即纵向Listview上下颠倒),若为true,纵向Listview默认在最底部,而且第一项在最低下。
(2)、GridLayoutManager,类似GridView
三种构造函数:
GridLayoutManager(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) //可以直接在XMl中设置RecyclerView 属性”layoutManager”.
GridLayoutManager(Context context, int spanCount) //spanCount为列数,默认方向vertical
GridLayoutManager(Context context, int spanCount, int orientation, boolean reverseLayout)
//spanCount为列数,orientation为布局方向,reverseLayout决定布局是否反向。
(3)、StaggeredGridLayoutManager流式布局
两个构造函数:
StaggeredGridLayoutManager(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes)
StaggeredGridLayoutManager(int spanCount, int orientation) //spanCount为列数,orientation为布局方向
Item Animator动画
RecyclerView能够通过mRecyclerView.setItemAnimator(ItemAnimator animator)
设置添加、删除、移动、改变的动画效果。
RecyclerView提供了默认的ItemAnimator实现类:DefaultItemAnimator。如果没有特殊的需求,默认使用这个动画即可。
Item Decoration间隔样式
RecyclerView通过addItemDecoration()
方法添加item之间的分割线。Android并没有提供实现好的Divider,因此任何分割线样式都需要自己实现。
自定义间隔样式需要继承RecyclerView.ItemDecoration
类,该类是个抽象类,官方目前并没有提供默认的实现类,主要有三个方法。
- onDraw(Canvas c, RecyclerView parent, State state),在Item绘制之前被调用,该方法主要用于绘制间隔样式。
- onDrawOver(Canvas c, RecyclerView parent, State state),在Item绘制之前被调用,该方法主要用于绘制间隔样式。
- getItemOffsets(Rect outRect, View view, RecyclerView parent, State state),设置item的偏移量,偏移的部分用于填充间隔样式,即设置分割线的宽、高;在RecyclerView的
onMesure()
中会调用该方法。
onDraw()
和onDrawOver()
这两个方法都是用于绘制间隔样式,我们只需要复写其中一个方法即可。
局部刷新闪屏问题解决
对于RecyclerView的Item Animator,有一个常见的坑就是“闪屏问题”。
这个问题的描述是:当Item视图中有图片和文字,当更新文字并调用notifyItemChanged()
时,文字改变的同时图片会闪一下。这个问题的原因是当调用notifyItemChanged()
时,会调用DefaultItemAnimator的animateChangeImpl()
执行change动画,该动画会使得Item的透明度从0变为1,从而造成闪屏。
解决办法很简单,在rv.setAdapter()
之前调用((SimpleItemAnimator)rv.getItemAnimator()).setSupportsChangeAnimations(false)
禁用change动画。
点击事件
RecyclerView并没有像ListView一样暴露出Item点击事件或者长按事件处理的api,也就是说使用RecyclerView时候,需要我们自己来实现Item的点击和长按等事件的处理。
实现方法有很多:
- 可以监听RecyclerView的Touch事件然后判断手势做相应的处理,
- 也可以通过在绑定ViewHolder的时候设置监听,然后通过Apater回调出去
RecylerView相对于ListView的优点罗列如下:
- RecyclerView封装了viewholder的回收复用,也就是说RecyclerView标准化了ViewHolder,编写Adapter面向的是ViewHolder而不再是View了,复用的逻辑被封装了,写起来更加简单。
直接省去了listview中convertView.setTag(holder)和convertView.getTag()这些繁琐的步骤。 - 提供了一种插拔式的体验,高度的解耦,异常的灵活,针对一个Item的显示RecyclerView专门抽取出了相应的类,来控制Item的显示,使其的扩展性非常强。
- 设置布局管理器以控制Item的布局方式,横向、竖向以及瀑布流方式
- 可设置Item的间隔样式(可绘制)通过继承RecyclerView的ItemDecoration这个类,然后针对自己的业务需求去书写代码。
- 可以控制Item增删的动画,可以通过ItemAnimator这个类进行控制,当然针对增删的动画,RecyclerView有其自己默认的实现。
但是关于Item的点击和长按事件,需要用户自己去实现。
三、基本使用
1、导入android-support-v7-recyclerview
2、Activity布局文件
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.raphets.recyclerview.MainActivity" > <android.support.v7.widget.RecyclerView android:id="@+id/recyclerView" android:layout_width="match_parent" android:layout_height="match_parent" /> </RelativeLayout>
3、Item的布局文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="50dp" android:background="#0099ff" android:orientation="vertical" > <TextView android:id="@+id/textView" android:layout_width="120dp" android:layout_height="match_parent" android:layout_gravity="center" android:gravity="center" /> </LinearLayout>
4、Activity类,RecyclerView的主要代码
public class MainActivity extends Activity { private RecyclerView mRecyclerView; private List<String> mDatas; private MyRecylerViewAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 初始化数据 initData(); mRecyclerView = (RecyclerView) findViewById(R.id.recyclerView); adapter = new MyRecylerViewAdapter(this, mDatas); //绑定适配器 mRecyclerView.setAdapter(adapter); // 给每个item添加分割线 mRecyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL_LIST)); // 设置item增加和移除的动画 mRecyclerView.setItemAnimator(new DefaultItemAnimator()); // 设置布局管理器 LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this); mRecyclerView.setLayoutManager(linearLayoutManager); } /* * 初始化数据 */ private void initData() { mDatas = new ArrayList<String>(); for (int i = 0; i <= 50; i++) { mDatas.add("item---" + i); } } @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { int id = item.getItemId(); switch (id) { case R.id.listview: mRecyclerView.setLayoutManager(new LinearLayoutManager(this, OrientationHelper.VERTICAL, false)); break; case R.id.gridView: mRecyclerView.setLayoutManager(new GridLayoutManager(this, 3)); break; case R.id.horizonalListview: mRecyclerView.setLayoutManager(new LinearLayoutManager(this, OrientationHelper.HORIZONTAL, false)); break; case R.id.horizonalGridview: mRecyclerView.setLayoutManager(new GridLayoutManager(this, 5, OrientationHelper.HORIZONTAL, false)); break; case R.id.add: adapter.notifyItemInserted(1); break; case R.id.delete: adapter.notifyItemRemoved(1); break; default: break; } return super.onOptionsItemSelected(item); } }
5、适配器Adapter
public class MyRecylerViewAdapter extends Adapter<MyViewHolder> { private Context mContext; private List<String> mDatas; public MyRecylerViewAdapter(Context context, List<String> datas) { this.mContext = context; this.mDatas = datas; } @Override public int getItemCount() { // TODO Auto-generated method stub return mDatas.size(); } @Override public void onBindViewHolder(MyViewHolder arg0, int arg1) { arg0.textView.setText(mDatas.get(arg1)); } @Override public MyViewHolder onCreateViewHolder(ViewGroup arg0, int arg1) { View view = LayoutInflater.from(mContext).inflate(R.layout.item, arg0, false); MyViewHolder holder = new MyViewHolder(view); return holder; } } class MyViewHolder extends ViewHolder { // Item子布局上的一个元素 TextView textView; public MyViewHolder(View itemView) { super(itemView); // 关联引动该元素 ,在item.xml中findView,注意不要忘写(itemview.) textView = (TextView) itemView.findViewById(R.id.textView); } }
下拉后从上端刷新
(在demo中是名为PullDownRefresh的module)
下拉从上端刷新,这个比较简单。在布局文件里,用SwipeRefreshLayout把RecyclerView包在里面,然后再在java代码里面写下拉的响应事件就好了。下面直接写代码:
1.布局文件,把RecyclerView放在SwipeRefreshLayout里:
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/srl" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v7.widget.RecyclerView android:id="@+id/rv" android:layout_width="match_parent" android:layout_height="match_parent"/>
2.java代码:
//列表
recyclerView= (RecyclerView) findViewById(R.id.rv);
recyclerView.setLayoutManager(new LinearLayoutManager(this));
//添加数据
list=new ArrayList<>(); for (int i = 0; i < 10; i++) { list.add("第"+i+"项"); } adapter=new ItemAdapter(list,this); recyclerView.setAdapter(adapter); //下拉加载控件 swipeRefreshLayout= (SwipeRefreshLayout) findViewById(R.id.srl); swipeRefreshLayout.setColorSchemeColors(Color.BLUE);//设置旋转圈的颜色 //下拉监听 swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() { @Override public void onRefresh() { list.add(0,"下拉加载出现的:"+i++); adapter.notifyDataSetChanged(); swipeRefreshLayout.setRefreshing(false);//设置成true的话,下拉过后就会一直在那里转 } });
(在demo中是名为PullUpRefresh的module)
3.上拉从下端刷新
设置一个监听器,在上拉到开始显示最下面一项时,加载更多项。
监听器EndLessOnScrollListener代码:
public abstract class EndLessOnScrollListener extends RecyclerView.OnScrollListener { private static final String TAG = "EndLessOnScrollListener"; LinearLayoutManager linearLayoutManager; //当前所在页 private int currentPage=0; //已经加载出来的item数 private int totalItemCount=0; //用来存储上一个totalItemCount private int previousTotal=0; //屏幕可见的item数量 private int visibleItemCount; //屏幕可见第一个Item的位置 private int firstVisibleItem; //是否上拉数据 private boolean loading=true; public EndLessOnScrollListener(LinearLayoutManager linearLayoutManager) { this.linearLayoutManager = linearLayoutManager; } @Override public void onScrolled(RecyclerView recyclerView, int dx, int dy) { super.onScrolled(recyclerView, dx, dy); visibleItemCount=recyclerView.getChildCount(); totalItemCount=linearLayoutManager.getItemCount(); firstVisibleItem=linearLayoutManager.findFirstVisibleItemPosition(); //去掉loading也可以,但是性能会下降,在每次滑动时都会判断,所以的加上 if(loading){ Log.d(TAG, "firstVisibleItem: " + firstVisibleItem); Log.d(TAG, "totalItemCount:" + totalItemCount); Log.d(TAG, "visibleItemCount:" + visibleItemCount); Log.d(TAG, "currentPage:" + currentPage); if(totalItemCount>previousTotal){ //说明数据项已经加载结束 loading=false; previousTotal=totalItemCount; } } //实际效果是滑动到已加载页最后一项可见的瞬间,添加下一页 if(!loading&&totalItemCount-visibleItemCount<=firstVisibleItem){ currentPage++; onLoadMore(currentPage); loading=true; } } /** * 提供一个抽闲方法,在Activity中监听到这个EndLessOnScrollListener * 并且实现这个方法 * 这个方法在可见的页的最后一项,可见时调用 * currentPage是加载到的页面编号 */ public abstract void onLoadMore(int currentPage);
给recyclerview添加上拉监听事件即可,这里我让它每次加5项:
recyclerView.addOnScrollListener(new EndLessOnScrollListener(linearLayoutManager) {
@Override
public void onLoadMore(int currentPage) { for (int i = count; i < 5+count; i++) { list.add("上拉加载"+i); } adapter.notifyDataSetChanged(); count+=5; } });
4.添加尾部首部分别添加footer和Head
(在demo中是名为HeaderAndFooter的module)
实现方法,主要是在适配器里实现。要在适配器必须写的方法里面和getItemViewType()方法里,考虑可能最前和最后一项分别是header和footer情况。
1.temAdapter里的代码
private static final int TYPE_HEADER = 0; private static final int TYPE_FOOTER = 1; private static final int TYPE_NORMAL = 2; public ItemAdapter(List<String> list, Context context) { this.list = list; this.context = context; } @Override public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { if (headerView != null && viewType == TYPE_HEADER) { return new MyViewHolder(headerView); } if (footerView != null && viewType == TYPE_FOOTER) { return new MyViewHolder(footerView); } MyViewHolder holder = new MyViewHolder(LayoutInflater.from(context). inflate(R.layout.item_layout, parent, false)); return holder; } @Override public void onBindViewHolder(MyViewHolder holder, final int position) { if (getItemViewType(position) == TYPE_NORMAL) { holder.tv.setText(list.get(position - 1)); return; } else if (getItemViewType(position) == TYPE_HEADER) { return; } else return; } /** * 重写这个方法,很重要,是加入Header和Footer的关键,我们通过判断item的类型,从而绑定不同的view */ @Override public int getItemViewType(int position) { if (headerView == null && footerView == null) { return TYPE_NORMAL; } if (position == 0) { //第一个item应该加载Header return TYPE_HEADER; } if (position == getItemCount() - 1) { //最后一个,应该加载Footer return TYPE_FOOTER; } return TYPE_NORMAL; } @Override public int getItemCount() { if (headerView == null && footerView == null) { return list.size(); } else if (headerView == null && footerView != null) { return list.size() + 1; } else if (headerView != null && footerView == null) { return list.size() + 1; } else { return list.size() + 2; } } public View getHeaderView() { return headerView; } public void setHeaderView(View headerView) { this.headerView=headerView; notifyItemInserted(0); } public View getFooterView() { return footerView; } public void setFooterView(View footerView) { this.footerView=footerView; notifyItemInserted(getItemCount()-1); } class MyViewHolder extends RecyclerView.ViewHolder { TextView tv; public MyViewHolder(View itemView) { super(itemView); tv = itemView.findViewById(R.id.tv); } }
活动里面的代码:
RecyclerView recyclerView;
ItemAdapter adapter;
List<String>list;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() { list= new ArrayList<>(); for (int i = 0; i < 10; i++) { list.add("第"+i+"项"); } adapter=new ItemAdapter(list,this); recyclerView= (RecyclerView) findViewById(R.id.rv); recyclerView.setAdapter(adapter); recyclerView.setLayoutManager(new LinearLayoutManager(this)); //注意,以下两个方法必须在setAdapter()之后调用,否则长和宽会变成wrap_content addHeader(); addFooter(); } private void addHeader(){ View header= LayoutInflater.from(this).inflate(R.layout.header_layout,recyclerView,false); adapter.setHeaderView(header); } private void addFooter(){ View footer= LayoutInflater.from(this).inflate(R.layout.footer_layout,recyclerView,false); adapter.setFooterView(footer); }
tem拖拽和滑动删除
ItemTouchHelper是一个处理RecyclerView的滑动删除和拖拽的辅助类,RecyclerView 的item拖拽移动和滑动删除就靠它来实现。
ItemTouchHelper的监听如下
itemTouchHelper=new ItemTouchHelper(new ItemTouchHelper.Callback() { //用于设置拖拽和滑动的方向 @Override public int getMovementFlags(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) { int dragFlags=0,swipeFlags=0; if(recyclerView.getLayoutManager() instanceof StaggeredGridLayoutManager||recyclerView.getLayoutManager() instanceof GridLayoutManager){ //网格式布局有4个方向 dragFlags=ItemTouchHelper.UP|ItemTouchHelper.DOWN|ItemTouchHelper.LEFT|ItemTouchHelper.RIGHT; }else if(recyclerView.getLayoutManager() instanceof LinearLayoutManager){ //线性式布局有2个方向 dragFlags=ItemTouchHelper.UP|ItemTouchHelper.DOWN; swipeFlags = ItemTouchHelper.START|ItemTouchHelper.END; //设置侧滑方向为从两个方向都可以 } return makeMovementFlags(dragFlags,swipeFlags);//swipeFlags 为0的话item不滑动 } //长摁item拖拽时会回调这个方法 @Override public boolean onMove(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, RecyclerView.ViewHolder target) { int from=viewHolder.getAdapterPosition(); int to=target.getAdapterPosition(); Meizi moveItem=meizis.get(from); meizis.remove(from); meizis.add(to,moveItem);//交换数据链表中数据的位置 mAdapter.notifyItemMoved(from,to);//更新适配器中item的位置 return true; } @Override public void onSwiped(RecyclerView.ViewHolder viewHolder, int direction) { //这里处理滑动删除 } @Override public boolean isLongPressDragEnabled() { return false;//返回true则为所有item都设置可以拖拽 } });
itemTouchHelper需要与recyclerView绑定才有效果,在recyclerView初始化的时候调用
itemTouchHelper.attachToRecyclerView(recyclerview);
因为我想要网格布局中的图片item可拖拽,而页数item不可拖拽,所以我isLongPressDragEnabled()方法返回的false,而在item的长点击事件监听中做具体处理。
mAdapter.setOnItemClickListener(new GridAdapter.OnRecyclerViewItemClickListener() { @Override public void onItemClick(View view) { } @Override public void onItemLongClick(View view) { itemTouchHelper.startDrag(recyclerview.getChildViewHolder(view));//设置拖拽item } });
如果你想为item设置拖拽和滑动时的响应动画效果,可以利用ItemTouchHelper的下面三个方法。用线性布局示例:
//当item拖拽开始时调用 @Override public void onSelectedChanged(RecyclerView.ViewHolder viewHolder, int actionState) { super.onSelectedChanged(viewHolder, actionState); if(actionState==ItemTouchHelper.ACTION_STATE_DRAG){ viewHolder.itemView.setBackgroundColor(Color.LTGRAY);//拖拽时设置背景色为灰色 } } //当item拖拽完成时调用 @Override public void clearView(RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder) { super.clearView(recyclerView, viewHolder); viewHolder.itemView.setBackgroundColor(Color.WHITE);//拖拽停止时设置背景色为白色 } //当item视图变化时调用 @Override public void onChildDraw(Canvas c, RecyclerView recyclerView, RecyclerView.ViewHolder viewHolder, float dX, float dY, int actionState, boolean isCurrentlyActive) { super.onChildDraw(c, recyclerView, viewHolder, dX, dY, actionState, isCurrentlyActive); //根据item滑动偏移的值修改item透明度。screenwidth是我提前获得的屏幕宽度 viewHolder.itemView.setAlpha(1-Math.abs(dX)/screenwidth); }