RecyclerView的使用(一)

作者: 丿歌吟有梦 | 来源:发表于2016-10-31 11:21 被阅读1638次

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,提供了很炫的动画效果

参考
Android RecyclerView 使用完全解析体验艺术般的控件

RecyclerView全攻略

RecyclerView的使用(一)