RecyclerView和CardView的使用

        前言：Material Design Library系列博客写完后总觉得缺少了点什么，后来一想RecyclerView和CardView虽然是android-suport-v7-21中添加的，但也是Material Design不可或缺的一部分，所以在这篇博客中结合SwipeRefreshLayout实现一个下拉刷新的Demo做个笔记。

       接下来实现的效果是这样的：

       通过下拉刷新增加item

       


1.新建工程并添加依赖：

compile 'com.android.support:recyclerview-v7:23.4.0'
compile 'com.android.support:cardview-v7:23.4.0'

2.新建一个布局recycler_item.xml作为RecyclerView的每个item，代码如下：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/id_card_view"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_margin="4dp"
app:cardBackgroundColor="#AABBCC"
app:cardCornerRadius="8dp"
android:elevation="2dp">

<TextView
android:id="@+id/id_item_tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="40sp"
android:layout_gravity="center"/>

</android.support.v7.widget.CardView>

这里只是在CardView下简单放置了一个TextView。

CardView下有三个重要的属性：

        cardBackgroundColor用来设置卡片的背景颜色

       
cardCornerRadius用来设置卡片的四个圆角尺寸

        elevation用来设置卡片在Z轴上的悬浮尺寸

3.修改activity_main.xml代码如下：

<?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="match_parent">

<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/id_swipe_refresh"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.v7.widget.RecyclerView
android:id="@+id/id_recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="vertical"/>

</android.support.v4.widget.SwipeRefreshLayout>

</LinearLayout>

这里用SwipeRefreshLayout将RecyclerView包裹住，需要注意的是SwipeRefreshLayout下只能有一个直接子View。

4.新建一个适配器类MyRecyclerAdapter用于RecyclerView的数据适配，代码如下：

class MyRecyclerAdapter extends RecyclerView.Adapter<MyRecyclerAdapter.ViewHolder> {

private LayoutInflater inflater;

public MyRecyclerAdapter(Context context) {
inflater = LayoutInflater.from(context);
mItemNum = 5;
mItemDatas = new ArrayList<String>();
for (int i=0; i<mItemNum; i++) {
mItemDatas.add(i, "item" + (i+1));
}
}

@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = inflater.inflate(R.layout.recycler_item, parent, false);
ViewHolder viewHolder = new ViewHolder(view);
return viewHolder;
}

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.itemTv.setText(mItemDatas.get(position));
}

@Override
public int getItemCount() {
return mItemDatas.size();
}

//自定义的ViewHolder，持有每个Item的所有界面元素
public class ViewHolder extends RecyclerView.ViewHolder {
public CardView itemCV;
public TextView itemTv;

public ViewHolder(View view) {
super(view);
itemCV = (CardView) view.findViewById(R.id.id_card_view);
itemTv = (TextView) view.findViewById(R.id.id_item_tv);
}
}
}

可以看到MyRecyclerView类重写了三个方法：
       onCreateViewHolder() => inflater出每个item的view，返回一个包含了具体view的ViewHolder
       onBindViewHolder() => 该方法通过接收ViewHolder和position这两个参数来确定是RecyclerView中的哪个item，然后将data与ViewHolder进行绑定，此时的ViewHolder已经是一个具有View和data的完整对象了
       getItemCount() => 顾名思义，获取item的数目
5.在onCreate()方法中加入RecyclerView部分的代码，如下：

mRecyclerView = (RecyclerView) findViewById(R.id.id_recycler_view);
//设置固定大小
mRecyclerView.setHasFixedSize(true);
//创建线性布局
mRecyclerLayoutManager = new LinearLayoutManager(this);
//垂直方向
mRecyclerLayoutManager.setOrientation(OrientationHelper.VERTICAL);
//给RecyclerView设置布局管理器
mRecyclerView.setLayoutManager(mRecyclerLayoutManager);
//创建适配器
mAdapter = new MyRecyclerAdapter(this);
mRecyclerView.setAdapter(mAdapter);

RecyclerView的使用主要分为三步：获取实例 -> 设置LayoutManager -> 添加适配器

/**----------到了这里RecyclerView的使用其实已经完成了，接下来的代码主要是为了增加对下拉刷新的支持！---------*/

6.在onCreate()方法中加入SwipeRefreshLayout的设置监听代码：

swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.id_swipe_refresh);
swipeRefreshLayout.setColorSchemeResources(R.color.colorPrimary);
swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
new Thread(new Runnable() {
@Override
public void run() {
mItemDatas.add(mItemNum, "item" + (mItemNum+1));
mItemNum++;

try {
Thread.sleep(1000);
} catch (InterruptedException e) {
e.printStackTrace();
}
mHandler.sendEmptyMessage(0);
}
}).start();
}
});

7.添加handler处理部分代码：

private Handler mHandler = new Handler(){
@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
swipeRefreshLayout.setRefreshing(false);
mAdapter.notifyDataSetChanged();
}
};

SwipeRefreshLayout下主要有5个方法：

       setOnRefreshListener() => 设置手势滑动监听器
       setProgressBackgroundColor() => 设置进度圈的背景颜色

       setColorSchemeResources() => 设置进度动画的颜色

       setRefreshing() => 设置组件是否在刷新，一般在刷新完成后设置为false

       setSize() => 设置进度圈的大小，只有两个值：DEFAULT、LARGE

源码地址：http://download.csdn.net/detail/chenhao0428/9567747

想全面完整地学习Material Design可以参考这里：http://www.mobileui.cn/material-design/