【Android-RecyclerView】瀑布流实现

原文地址： http://blog.youkuaiyun.com/louis_scl/article/details/43965833

Android 5.0 开始引入了 RecyclerView。

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

RecyclerView的使用

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

Adapter： 

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

[java]  view plain copy

1. public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {  
2.         private String[] dataSet;  
3.         public MyAdapter(String[] dataSet) {  
4.             this.dataSet = dataSet;  
5.         }  
6.   
7.         public class ViewHolder extends RecyclerView.ViewHolder {  
8.             private TextView textview;  
9.   
10.             public ViewHolder(View itemView) {  
11.                 super(itemView);  
12.                 this.textview = (TextView) itemView.findViewById(R.id.text);  
13.             }  
14.         }  
15.   
16.         @Override  
17.         public int getItemCount() {  
18.             return dataSet.length;  
19.         }  
20.   
21.         @Override  
22.         public void onBindViewHolder(ViewHolder vh, int position) {//用户刷新views  
23.             vh.textview.setText(dataSet[position]);  
24.         }  
25.   
26.         @Override  
27.         public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {//用于创建的新views  
28.             View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.griditem_layout,  
29.                     parent, false);  
30.             ViewHolder vh = new ViewHolder(v);  
31.             return vh;  
32.         }  
33.     }  

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

新的Adapter中多了两个方法：

[java]  view plain copy

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

[java]  view plain copy

1. 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中添加

[html]  view plain copy

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

代码实现：

主Activity布局文件：activity_main.xml：

[html]  view plain copy

1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"  
3.     android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"  
4.     android:paddingRight="@dimen/activity_horizontal_margin"  
5.     android:paddingTop="@dimen/activity_vertical_margin"  
6.     android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">  
7.   
8.   
9.     <android.support.v7.widget.RecyclerView  
10.         android:id="@+id/recyclerview"  
11.         android:layout_width="match_parent"  
12.         android:layout_height="match_parent"/>  
13.   
14. </RelativeLayout><strong>  
15. </strong>  

itemView的布局文件：griditem_layout.xml

[html]  view plain copy

1. <?xml version="1.0" encoding="utf-8"?>  
2.   
3. <RelativeLayout  
4.     android:id="@+id/layout"  
5.     android:layout_width="match_parent"  
6.     android:layout_height="wrap_content"  
7.     android:padding="16dp"  
8.     xmlns:android="http://schemas.android.com/apk/res/android">  
9.   
10.     <TextView xmlns:android="http://schemas.android.com/apk/res/android"  
11.         android:id="@+id/text"  
12.         android:layout_width="match_parent"  
13.         android:layout_height="wrap_content" />  
14. </RelativeLayout>  

MainActivity.java:

[html]  view plain copy

1. package com.louisscl.recyclerveiwdemo;  
2.   
3. import android.graphics.Color;  
4. import android.graphics.Rect;  
5. import android.os.Bundle;  
6. import android.support.v7.app.ActionBarActivity;  
7. import android.support.v7.widget.RecyclerView;  
8. import android.support.v7.widget.StaggeredGridLayoutManager;  
9. import android.view.LayoutInflater;  
10. import android.view.Menu;  
11. import android.view.MenuItem;  
12. import android.view.View;  
13. import android.view.ViewGroup;  
14. import android.widget.BaseAdapter;  
15. import android.widget.RelativeLayout;  
16. import android.widget.TextView;  
17.   
18. public class MainActivity extends ActionBarActivity {  
19.   
20.     private RecyclerView recyclerView;  
21.     private StaggeredGridLayoutManager staggeredGridLayoutManager;  
22.     private MyAdapter adapter;  
23.     private String[] dataSet = {//数据源  
24.             "1111111111111111111111111111111111111111111111"  
25.             , "222222"  
26.             , "33333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333"  
27.             , "444444444444444444444444444444444"  
28.             , "55555555555555555"  
29.             , "666666666666666666666666666666666666666666666666666666666666666666666"  
30.             , "7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777"  
31.             , "1111111111111111111111111111111111111111111111"  
32.             , "222222"  
33.             , "33333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333"  
34.             , "444444444444444444444444444444444"  
35.             , "55555555555555555"  
36.             , "666666666666666666666666666666666666666666666666666666666666666666666"  
37.             , "7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777"  
38.             , "1111111111111111111111111111111111111111111111"  
39.             , "222222"  
40.             , "33333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333"  
41.             , "444444444444444444444444444444444"  
42.             , "55555555555555555"  
43.             , "666666666666666666666666666666666666666666666666666666666666666666666"  
44.             , "7777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777777"};  
45.   
46.     @Override  
47.     protected void onCreate(Bundle savedInstanceState) {  
48.         super.onCreate(savedInstanceState);  
49.         setContentView(R.layout.activity_main);  
50.         recyclerView = (RecyclerView) findViewById(R.id.recyclerview);  
51.         staggeredGridLayoutManager = new StaggeredGridLayoutManager(2,  
52.                 StaggeredGridLayoutManager.VERTICAL);  
53.         recyclerView.setLayoutManager(staggeredGridLayoutManager);  
54.         recyclerView.addItemDecoration(new SpaceItemDecoration(20)); //设置间隔  
55.         adapter = new MyAdapter(dataSet);  
56.         recyclerView.setAdapter(adapter);  
57.     }  
58.   
59.     @Override  
60.     public boolean onCreateOptionsMenu(Menu menu) {  
61.         getMenuInflater().inflate(R.menu.menu_main, menu);  
62.         return true;  
63.     }  
64.   
65.     @Override  
66.     public boolean onOptionsItemSelected(MenuItem item) {  
67.         // Handle action bar item clicks here. The action bar will  
68.         // automatically handle clicks on the Home/Up button, so long  
69.         // as you specify a parent activity in AndroidManifest.xml.  
70.         int id = item.getItemId();  
71.         if (id == R.id.action_settings) {  
72.             return true;  
73.         }  
74.         return super.onOptionsItemSelected(item);  
75.     }  
76.   
77.   
78.     public class SpaceItemDecoration extends RecyclerView.ItemDecoration {  
79.         private int space;  
80.         public SpaceItemDecoration(int space) {  
81.             this.space = space;  
82.         }  
83.   
84.         @Override  
85.         public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {  
86.             outRect.left = space;  
87.             outRect.right = space;  
88.             outRect.bottom = space;  
89.             if (parent.getChildPosition(view) == 0) {  
90.                 outRect.top = space;  
91.             }  
92.         }  
93.     }  
94.   
95.     public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {  
96.         private String[] dataSet;  
97.         public MyAdapter(String[] dataSet) {  
98.             this.dataSet = dataSet;  
99.         }  
100.   
101.         public class ViewHolder extends RecyclerView.ViewHolder {  
102.             private TextView textview;  
103.             private RelativeLayout relativeLayout;  
104.   
105.             public ViewHolder(View itemView) {  
106.                 super(itemView);  
107.                 this.textview = (TextView) itemView.findViewById(R.id.text);  
108.                 this.relativeLayout = (RelativeLayout) itemView.findViewById(R.id.layout);  
109.             }  
110.         }  
111.   
112.         @Override  
113.         public int getItemCount() {  
114.             return dataSet.length;  
115.         }  
116.   
117.         @Override  
118.         public void onBindViewHolder(ViewHolder vh, int position) {  
119.             vh.textview.setText(dataSet[position]);  
120.             vh.relativeLayout.setBackgroundColor(position % 2 == 0 ? Color.CYAN : Color.YELLOW);  
121.         }  
122.   
123.         @Override  
124.         public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {  
125.             View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.griditem_layout,  
126.                     parent, false);  
127.             ViewHolder vh = new ViewHolder(v);  
128.             return vh;  
129.         }  
130.     }  
131. }  

效果图：