【Android-RecyclerView】瀑布流实现

Android 5.0 开始引入了 RecyclerView。

RecyclerView组件 是一个实现列表的组件，可以实现原来的 ListView， GridView，性能更好。

RecyclerView的使用

和ListView一样，使用RecyclerView需要提供一个Adapter。不一样的是还需要提供一个Layout Manager。

Adapter： 

继承  RecyclerView.Adapter<VH extends RecyclerView.ViewHolder>

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
        private String[] dataSet;
        public MyAdapter(String[] dataSet) {
            this.dataSet = dataSet;
        }

        public class ViewHolder extends RecyclerView.ViewHolder {
            private TextView textview;

            public ViewHolder(View itemView) {
                super(itemView);
                this.textview = (TextView) itemView.findViewById(R.id.text);
            }
        }

        @Override
        public int getItemCount() {
            return dataSet.length;
        }

        @Override
        public void onBindViewHolder(ViewHolder vh, int position) {//用户刷新views
            vh.textview.setText(dataSet[position]);
        }

        @Override
        public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {//用于创建的新views
            View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.griditem_layout,
                    parent, false);
            ViewHolder vh = new ViewHolder(v);
            return vh;
        }
    }

以前用ListView或者GridView的时候进场会用到 ViewHolder来简化对itemView的操作，现在Google直接把ViewHolder集成到了Adapter中，方便了很多。

新的Adapter中多了两个方法：

<pre name="code" class="java">onCreateViewHolder(ViewGroup parent, int viewType)

onBindViewHolder(ViewHolder vh, int position)

其实这两个方法实现了原来Adapter中的getView(int position, View convertView, ViewGroup parent) 方法。

原来是需要判断convertView是否已经创建，没有创建就先创建，创建了的就直接更新界面。

而现在把这些逻辑判断都封装到了layout manager中。只需要实现onCreateViewHolder来实现itemView的创建，onBindViewHolder来实现itemView的更新。

LayoutManager:

LayoutManager的作用：

1、控制itemView在RecyclerView中的布局样式（如ListView样式还是GridView样式）

2、判断何时创建itemView，何时复用itemView

3、调用Adapter创建或者复用itemView 即：onCreateViewHolder和onBindViewHolder

目前提供三种LayoutManager:

1、LinearLayoutManager：实现ListView效果

2、GridLayoutManager：实现GridView效果

3、StaggeredGridLayoutManager：实现瀑布流效果。

也可以通过继承RecyclerView.LayoutManager来自定义一个LayoutManager来实现自己想要的效果。

这里主要来介绍一下，用RecyclerView来时实现瀑布流的做法。

首先是要引入 android support 库 

eclipse：

Android Studio:

在你的app module中的build.gradle的dependencies中添加

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

代码实现：

主Activity布局文件：activity_main.xml：

<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=".MainActivity">


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

</RelativeLayout><strong>
</strong>

itemView的布局文件：griditem_layout.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout
    android:id="@+id/layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="16dp"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <TextView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</RelativeLayout>

MainActivity.java:

package com.louisscl.recyclerveiwdemo;

import android.graphics.Color;
import android.graphics.Rect;
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.RelativeLayout;
import android.widget.TextView;

public class MainActivity extends ActionBarActivity {

    private RecyclerView recyclerView;
    private StaggeredGridLayoutManager staggeredGridLayoutManager;
    private MyAdapter adapter;
    private String[] dataSet = {//数据源
            "1111111111111111111111111111111111111111111111"
            , "222222"
            , "33333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333"
            , "444444444444444444444444444444444"
            , "55555555555555555"
            , "666666666666666666666666666666666666666666666666666666666666666666666"
            , "7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777"
            , "1111111111111111111111111111111111111111111111"
            , "222222"
            , "33333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333"
            , "444444444444444444444444444444444"
            , "55555555555555555"
            , "666666666666666666666666666666666666666666666666666666666666666666666"
            , "7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777"
            , "1111111111111111111111111111111111111111111111"
            , "222222"
            , "33333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333"
            , "444444444444444444444444444444444"
            , "55555555555555555"
            , "666666666666666666666666666666666666666666666666666666666666666666666"
            , "7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        recyclerView = (RecyclerView) findViewById(R.id.recyclerview);
        staggeredGridLayoutManager = new StaggeredGridLayoutManager(2,
                StaggeredGridLayoutManager.VERTICAL);
        recyclerView.setLayoutManager(staggeredGridLayoutManager);
        recyclerView.addItemDecoration(new SpaceItemDecoration(20)); //设置间隔
        adapter = new MyAdapter(dataSet);
        recyclerView.setAdapter(adapter);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }


    public class SpaceItemDecoration extends RecyclerView.ItemDecoration {
        private int space;
        public SpaceItemDecoration(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.getChildPosition(view) == 0) {
                outRect.top = space;
            }
        }
    }

    public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
        private String[] dataSet;
        public MyAdapter(String[] dataSet) {
            this.dataSet = dataSet;
        }

        public class ViewHolder extends RecyclerView.ViewHolder {
            private TextView textview;
            private RelativeLayout relativeLayout;

            public ViewHolder(View itemView) {
                super(itemView);
                this.textview = (TextView) itemView.findViewById(R.id.text);
                this.relativeLayout = (RelativeLayout) itemView.findViewById(R.id.layout);
            }
        }

        @Override
        public int getItemCount() {
            return dataSet.length;
        }

        @Override
        public void onBindViewHolder(ViewHolder vh, int position) {
            vh.textview.setText(dataSet[position]);
            vh.relativeLayout.setBackgroundColor(position % 2 == 0 ? Color.CYAN : Color.YELLOW);
        }

        @Override
        public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.griditem_layout,
                    parent, false);
            ViewHolder vh = new ViewHolder(v);
            return vh;
        }
    }
}

效果图：