Android中使用RecyclerView和CardView实现瀑布流效果(StaggeredGrid)

在Android 5.0 中引入了Material Design的设计理念，并加入了RecyclerView和CardView两个控件。本文就讲解如何使用者两个控件来实现瀑布流效果(StaggeredGrid)。

先上效果图

RecyclerView

RecyclerView 是一个更加高级和灵活的ListView。它简化了显示和处理数据的过程，比如，为positioning item提供了layout 的管理，为item删除和添加提供了默认的动画。当然，你也可以自定义这些动画。

LayoutManger决定RecyclerView中元素的位置和何时重用那些不再显示的item。LayoutManager通过避免创建不必要的view和不调用费时的findViewById() 来提高效率。
RecyclerView提供了三种内建的LayoutManger：

• LinearLayoutManager 垂直或者水平的可以滑动的list
• GridLayoutManager 以grid的方式显示
• StaggeredGridLayoutManager 以瀑布流的形式显示（本文重点 (⊙v⊙)嗯）

动画

RecyclerView是有默认的添加删除item的动画的，如果想要自定义这些动画，继承RecyclerView.ItemAnimator 这个类，并使用RecyclerView.setItemAnimator() 这个方法。

例子

activity_recycler_view.xml

<?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" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.example.daniel.test.activities.RecyclerViewActivity">

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

</RelativeLayout>

view_holder.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:orientation="horizontal">

    <TextView
        android:id="@+id/tv_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ImageView
        android:id="@+id/iv_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

Activity

public class RecyclerViewActivity extends AppCompatActivity {
   

    private RecyclerView mRecyclerView;