Android --- Recyclerview and Cardview

首先，先来介绍下这两个组件：

Recylerview:

Google官方定义：

RecyclerView 小组件比 ListView 更高级且更具灵活性。
此小组件是一个用于显示庞大数据集的容器，可通过保持有限数量的视图进行非常有效的滚动操作。如果您有数据集合，其中的元素将因用户操作或网络事件而发生改变，请使用 RecyclerView 小组件。

如果要使用 RecyclerView 小组件，必须指定一个适配器和一个布局管理器。要创建一个适配器，需扩展 RecyclerView.Adapter 类别，RecyclerView 提供这些内置布局管理器：

• LinearLayoutManager 以垂直或水平滚动列表方式显示项目。
• GridLayoutManager 在网格中显示项目。
• StaggeredGridLayoutManager 在分散对齐网格中显示项目。

Cardview

CardView 小组件可拥有阴影和圆角。

RecyclerView 与 CardView 小组件为 v7 支持内容库的一部分。使用前需添加依赖项。

compile 'com.android.support:cardview-v7:21.0.+'compile 'com.android.support:recyclerview-v7:21.0.+'

1.打开Android Studio，新建一个Android项目。

2.在build.gradle中添加依赖，然后sync your project。

3.新建activity_main.xml文件，并添加RecylerView

<?xml version="1.0" encoding="utf-8"?><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=".MainActivity">    <android.support.v7.widget.RecyclerView         xmlns:android="http://schemas.android.com/apk/res/android"        android:id="@+id/my_recycler_view"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:clipToPadding="false"        android:paddingBottom="16dp"        android:paddingTop="16dp"        android:scrollbars="vertical"         /></RelativeLayout>

4.使用CardView 创建RecylerView每一行的布局item_list.xml。

• 如果要在布局中设置圆角半径，请使用 card_view:cardCornerRadius 属性。
• 如果要设置卡片的背景颜色，请使用 card_view:cardBackgroundColor 属性。

<?xml version="1.0" encoding="utf-8"?><android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:card_view="http://schemas.android.com/apk/res-auto"    android:id="@+id/card_view"    android:layout_width="match_parent"    android:layout_height="80dp"    android:layout_marginBottom="8dp"    android:layout_marginLeft="16dp"    android:layout_marginRight="16dp"    android:background="#C5CAE9"    android:foreground="?attr/selectableItemBackground"    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"><RelativeLayout    android:layout_width="match_parent"    android:gravity="center"    android:layout_height="match_parent">    <ImageView        android:id="@+id/list_avatar"        android:layout_width="40dp"        android:layout_height="40dp"        android:layout_centerVertical="true"        android:layout_alignParentLeft="true"        android:layout_marginLeft="10dp"        android:scaleType="centerCrop"        android:src="@drawable/icon" />    <TextView        android:id="@+id/list_title"        android:layout_centerVertical="true"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_marginLeft="16dp"        android:layout_toRightOf="@+id/list_avatar"        android:text="Androidwarriors "        android:textColor="#000000"        android:textAppearance="?attr/textAppearanceListItem"        android:textSize="16sp" />    <TextView        android:id="@+id/list_desc"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_below="@+id/list_title"        android:layout_marginLeft="16dp"        android:layout_toRightOf="@+id/list_avatar"        android:textColor="#000000"        android:ellipsize="end"        android:singleLine="true"        android:text="Place to dive into android programming"        android:textAppearance="?attr/textAppearanceListItem"        android:textSize="14sp" /></RelativeLayout></android.support.v7.widget.CardView>

5.创建RecylerView的适配器MyAdapter 。
需要实现三个方法：

• onCreateViewHolder()
• onBindViewHolder()
• getItemCount()

public class MyAdapter extends RecyclerView.Adapter {    @Override    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {        return null;    }    @Override    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {    }    @Override    public int getItemCount() {        return 0;    }}

6.通过继承RecyclerView.ViewHolder 创建自定义ViewHolder.

   // 重写的自定义ViewHolder   public static class ViewHolder extends RecyclerView.ViewHolder {       public TextView mTextView;       public ImageView mImageView;       public ViewHolder(View v) {           super(v);           mTextView = (TextView) v.findViewById(R.id.list_title);           mImageView = (ImageView) v.findViewById(R.id.list_avatar);       }   }

7.用以下代码替换MyAdapter 中的。

    @Override    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {        // 给ViewHolder设置布局文件        View v = inflater.inflate(R.layout.item_list, parent, false);        ViewHolder vh = new ViewHolder(v);        return vh;    }    @Override    public void onBindViewHolder(ViewHolder holder, int position) {        // 给ViewHolder设置元素        ItemBean p = ItemBeans.get(position);        holder.mTextView.setText(p.getTv());        holder.mImageView.setImageResource(p.getImg());    }    @Override    public int getItemCount() {        // 返回数据总数        return ItemBeans == null ? 0 : ItemBeans.size();    }

8.在MainActivity完成View的初始化以及RecylerView的数据适配。

mRecyclerView = (RecyclerView) findViewById(R.id.my_recycler_view);        // 设置LinearLayoutManager        mRecyclerView.setLayoutManager(new LinearLayoutManager(this));        mAdapter = new MyAdapter(this, itemList);        mRecyclerView.setAdapter(mAdapter);

运行效果：

源码