RecyclerView的使用(一)
本篇主要介绍RecyclerView的初步使用,可以实现ListView,GridView和瀑布流。使用RecyclerView推荐使用github开源UltimateRecyclerView,很强大
本篇只是基础篇,更好的基础介绍请看鸿洋大神的博客:
Android RecyclerView 使用完全解析 体验艺术般的控件
我会在下几篇会介绍
- RecyclerView添加Header头部
- 多布局的RecyclerView
(一)配置
使用AndroidStudio工具,在build.gradle文件中加入v7包和recyclerview包,我这里使用的版本是22.2.0,推荐使用更高的版本
dependencies {
compile 'com.android.support:appcompat-v7:22.2.0'
compile 'com.android.support:recyclerview-v7:22.2.0'
}
(二) 了解RecyclerView
RecyclerView的介绍:
- 提供了基础的增加/移除动画
- 可以定义布局管理器
- RecyclerView本身就提供了ViewHolder,我们只要继承自该ViewHolder就可以了,至于ViewHolder怎么存储,系统会自动帮我们搞定。
- 分割线没有android:dividerHeight=""和android:divider=""的属性,需要设置addItemDecoration
- 没有提供Item的点击事件,需要自己去实现
- 没有提供添加头部Header和底部Footer的方法
RecyclerView可以实现:
- ListView的功能
- GridView的功能
- 横向ListView的功能
- 横向GridView的功能
- 瀑布流效果
- 便于添加Item增加和移除动画
生命周期
一个RecyclerView的Item加载是有顺序的,类似于Activity的生命周期(姑且这么叫把),具体可以对adapter的每个方法进行重写打下日志进行查看,具体大致为:
getItemViewType(获取显示类型,返回值可在onCreateViewHolder中拿到,以决定加载哪种ViewHolder)
onCreateViewHolder(加载ViewHolder的布局)
onViewAttachedToWindow(当Item进入这个页面的时候调用)
onBindViewHolder(将数据绑定到布局上,以及一些逻辑的控制就写这啦)
onViewDetachedFromWindow(当Item离开这个页面的时候调用)
onViewRecycled(当Item被回收的时候调用)
tips1:如果你调用了:
viewHolder.setIsRecyclable(false);
那么这个Item的onViewRecycled将永远不会调用。
tips2:如果你的界面出现了错乱的现象,请调用如上代码可能能简单粗暴的解决,当然代价是损失少许的性能表现了。
RecyclerView的使用
<android.support.v7.widget.RecyclerView
android:id="@+id/id_recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent" />
mRecyclerView = (RecyclerView)findViewById(R.id.id_recyclerview);
//设置布局管理器
mRecyclerView.setLayoutManager(mLayoutManager);
//设置分割线
mRecyclerView.addItemDecoration();
//设置动画
mRecyclerView.setItemAnimator(new DefaultItemAnimator());
//设置Adapter
mRecyclerView.setAdapter(mAdapter);
(三)ListView的实现
使用LinearLayoutManager布局实现ListView
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class ListViewActivity extends AppCompatActivity {
private RecyclerView mRecyclerView;
private LinearLayoutManager mLayoutManager;
private LinearAdapter mAdapter;
private List<String> mDatas;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_water_full);
initData();
mRecyclerView = (RecyclerView) findViewById(R.id.id_recyclerview);
//设置布局
mLayoutManager = new LinearLayoutManager(this);
mRecyclerView.setLayoutManager(mLayoutManager);
//设置Adapter
mAdapter = new LinearAdapter();
mRecyclerView.setAdapter(mAdapter);
}
private void initData() {
mDatas = new ArrayList<String>();
for (int i = 0; i < 24; i++) {
mDatas.add("位置是" + i);
}
}
class LinearAdapter extends RecyclerView.Adapter<LinearAdapter.MyViewHolder> {
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
MyViewHolder holder = new MyViewHolder(LayoutInflater.from(
ListViewActivity.this).inflate(R.layout.item_linear,parent,false));
return holder;
}
@Override
public void onBindViewHolder(MyViewHolder holder, int position) {
holder.tv.setText(mDatas.get(position));
}
@Override
public int getItemCount() {
return mDatas.size();
}
public class MyViewHolder extends RecyclerView.ViewHolder {
TextView tv;
public MyViewHolder(View itemView) {
super(itemView);
tv = (TextView) itemView.findViewById(R.id.adapter_linear_text);
}
}
}
}
R.layout.item_linear
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/adapter_linear_text"
android:layout_width="match_parent"
android:layout_height="50dp"
android:gravity="center"/>
效果如图:
这里写图片描述
(四)分割线
没有分割线看不出来差别,我们添加分割线,代码是从鸿洋大神那拷过来在改的,主要改动是当Grid布局和瀑布流布局的时候,前两个顶部画分割线
代码是
import android.graphics.Rect;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.view.View;
/**
* @author zhy
* 鸿洋大神的bolg链接是:
* http://blog.csdn.net/lmj623565791/article/details/45059587
*/
public class SpacesItemDecoration extends RecyclerView.ItemDecoration {
private int space;
public SpacesItemDecoration(int space) {
this.space=space;
}
@Override
public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
outRect.left=space;
outRect.right=space;
outRect.bottom=space;
if(parent.getLayoutManager() instanceof GridLayoutManager || parent.getLayoutManager() instanceof StaggeredGridLayoutManager){
if(parent.getChildAdapterPosition(view) < 2){
outRect.top=space;
}
}else{
if(parent.getChildAdapterPosition(view)==0){
outRect.top=space;
}
}
}
}
使用
//添加分割线
mRecyclerView.addItemDecoration(new SpacesItemDecoration(12));
在看一下效果:
这里写图片描述
(五)GridView的实现
实现GridView我们只需要把LinearLayoutManager改成GridLayoutManager,就可以实现了
//设置Grid布局两列
mLayoutManager = new GridLayoutManager(this,2);
效果如图:
这里写图片描述
(六)瀑布流的实现
瀑布流设置StaggeredGridLayoutManager布局即可,高度我在onBindViewHolder随机生成
//设置瀑布流 垂直布局
mLayoutManager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL);
随机高度代码,高度在100~200px之间
Random random = new Random();
ViewGroup.LayoutParams params = holder.tv.getLayoutParams();
params .height = random.nextInt(100) + 100;
效果如图:
这里写图片描述
(七)横向布局
StaggeredGridLayoutManager,GridLayoutManager,LinearLayoutManager都是可以设置横向布局的,下面我们来看一下每个布局管理器的设置.
LinearLayoutManager可以设置为VERTICAL,HORIZONTAL和INVALID_OFFSET(不知道作用,有知道的可以告诉我谢谢)
//Context
new LinearLayoutManager(this);
//Context
//方向
//是否反向,设置true后倒序显示了,并且自动滚动到最后一行
new LinearLayoutManager(this,LinearLayoutManager.VERTICAL
,false)
GridLayoutManager同LinearLayoutManager一样,只不过多了个参数spanCount
//默认的垂直布局,第二个参数为列数
public GridLayoutManager(Context context, int spanCount){
}
//当方向为横向时候代表行数,为垂直方向是为列
//方向
//是否反向
public GridLayoutManager(Context context, int spanCount, int orientation,boolean reverseLayout) {
}
StaggeredGridLayoutManager
//行数或者列数
//方向
public StaggeredGridLayoutManager(int spanCount, int orientation) {
}
注意:当设置为水平方向时候,我们的Item布局文件宽度就不要设置match_parent了,高度设置为match_parent或者其他
(八)添加动画
RecyclerView可以添加默认的动画效果
// 设置item动画
mRecyclerView.setItemAnimator(new DefaultItemAnimator());
这动画是针对单个Item的,所以通过mAdapter.notifyDataSetChanged();是看不到动画效果的,RecyclerView.Adapter提供了mAdapter.notifyItemInserted(position);添加单个布局和mAdapter.notifyItemRemoved(position);移除单个布局的方法,通过这两个方法添加和移除的Item是有动画的。
我们在Adapter中添加两个方法
public void addData(int position) {
mDatas.add(position, "这是新加的一个");
notifyItemInserted(position);
}
public void removeData(int position) {
mDatas.remove(position);
notifyItemRemoved(position);
}
效果图如下:
这里写图片描述
动画来说相对简单,如果我们需要更炫的效果可以看githun的RecyclerViewItemAnimators,提供了很炫的动画效果
网友评论