RecyclerView的基本用法

RecyclerView 是一个增强版的ListView，不仅可以实现和ListView同样的效果，还优化了ListView中存在的各种不足之处

ResyslerView 能够实现横向滚动，这是ListView所不能实现的

目前官方更加推荐使用RecyclerView.

1.实现垂直方向的滚动

在   dependencies 中添加库的引用

 

1. dependencies {

2. compile fileTree(dir: 'libs', include: ['*.jar'])

3. testCompile 'junit:junit:4.12'

4. compile 'com.android.support:appcompat-v7:24.2.0'

5. compile 'com.android.support:recyclerview-v7:24.2.1'

6. }

添加布局文件：

 

 

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

2. <LinearLayout

3. xmlns:android="http://schemas.android.com/apk/res/android"

4. android:layout_width="match_parent"

5. android:layout_height="match_parent">

6.  

7. <android.support.v7.widget.RecyclerView

8. android:id="@+id/recycler_view"

9. android:layout_width="match_parent"

10. android:layout_height="match_parent">

11. </android.support.v7.widget.RecyclerView>

12. </LinearLayout>

创建RecyclerView 适配器 BookBaseAdapter ，这个类继承 RecyclerView.Adapter 并将泛型指定为 BookBaseAdapter.ViewHolder

 

其中ViewHolder是我们在 BookBaseAdapter 中定义的一个内部类：代码如下：

 

1. public class BookBaseAdapter extends RecyclerView.Adapter<BookBaseAdapter.ViewHolder>{

2.  

3. private List<Book> mBookList;

4.  

5. static class ViewHolder extends RecyclerView.ViewHolder{

6. ImageView bookImage;

7. TextView bookname;

8.  

9. public ViewHolder(View view) {

10. super(view);

11. bookImage = (ImageView) view.findViewById(R.id.book_iamge);

12. bookname = (TextView) view.findViewById(R.id.book_name);

13. }

14. }

15.  

16. public BookBaseAdapter(List<Book> mBookList) {

17. this.mBookList = mBookList;

18. }

19.  

1. //加载item 的布局 创建ViewHolder实例

2. @Override

3. public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

4. View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.book,parent,false);

5. ViewHolder holder = new ViewHolder(view);

6. return holder;

7. }

8.  

1. //对RecyclerView子项数据进行赋值

2. @Override

3. public void onBindViewHolder(ViewHolder holder, int position) {

4. Book book = mBookList.get(position);

5. holder.bookname.setText(book.getName());

6. holder.bookImage.setImageResource(book.getImageId());

7. }

1. //返回子项个数

2. @Override

3. public int getItemCount() {

4. return mBookList.size();

5. }

6. }

 

 

MainActivity调用：

 

1. public class MainActivity extends AppCompatActivity {

2.  

3. private List<Book> mlsit = new ArrayList<Book>();

4.  

5. @Override

6. protected void onCreate(Bundle savedInstanceState) {

7. super.onCreate(savedInstanceState);

8. setContentView(R.layout.activity_main);

9. //初始化List数据

10. initBook();

11. //初始化RecyclerView

12. RecyclerView recyslerview = (RecyclerView) findViewById(R.id.recycler_view);

13. //创建LinearLayoutManager 对象 这里使用 LinearLayoutManager 是线性布局的意思

14. LinearLayoutManager layoutmanager = new LinearLayoutManager(this);

15. //设置RecyclerView 布局

16. recyslerview.setLayoutManager(layoutmanager);

17. //设置Adapter

18. BookBaseAdapter adapter = new BookBaseAdapter(mlsit);

19. recyslerview.setAdapter(adapter);

20. }

21.  

22. private void initBook(){

23. for (int i = 0; i < 10; i++) {

24. Book book01 = new Book("Book"+i,R.drawable.icon01);

25. mlsit.add(book01);

26. Book book02 = new Book("Book"+i,R.drawable.icon02);

27. mlsit.add(book02);

28. Book book03 = new Book("Book"+i,R.drawable.icon03);

29. mlsit.add(book03);

30. }

31. }

32. }

main_layout布局：

 

 

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

2. <LinearLayout

3. xmlns:android="http://schemas.android.com/apk/res/android"

4. android:layout_width="match_parent"

5. android:layout_height="match_parent">

6.  

7. <android.support.v7.widget.RecyclerView

8. android:id="@+id/recycler_view"

9. android:layout_width="match_parent"

10. android:layout_height="match_parent">

11. </android.support.v7.widget.RecyclerView>

12. </LinearLayout>

 

 

item布局：

 

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

2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

3. android:layout_width="match_parent"

4. android:layout_height="wrap_content"

5. android:orientation="horizontal">

6.  

7. <ImageView

8. android:id="@+id/book_iamge"

9. android:layout_width="wrap_content"

10. android:layout_height="wrap_content"/>

11.  

12. <TextView

13. android:id="@+id/book_name"

14. android:layout_width="match_parent"

15. android:layout_height="wrap_content"/>

16.  

17. </LinearLayout>

 

 

此处省略Book对象的相关源码。如上就可以实现和ListView一样的效果。

 

2.实现横向滚动

对垂直布局中的代码做小修改：

 

onCreat方法中添加setOrientation（）方法来设置布局的排列方向

 

 	layoutmanager.setOrientation(LinearLayoutManager.HORIZONTAL);

 

 

 

1. @Override

2. protected void onCreate(Bundle savedInstanceState) {

3. super.onCreate(savedInstanceState);

4. setContentView(R.layout.activity_main);

5. //初始化List数据

6. initBook();

7. //初始化RecyclerView

8. RecyclerView recyslerview = (RecyclerView) findViewById(R.id.recycler_view);

9. //创建LinearLayoutManager 对象

10. LinearLayoutManager layoutmanager = new LinearLayoutManager(this);

11. layoutmanager.setOrientation(LinearLayoutManager.HORIZONTAL);

12. //设置RecyclerView 布局

13. recyslerview.setLayoutManager(layoutmanager);

14. //设置Adapter

15. BookBaseAdapter adapter = new BookBaseAdapter(mlsit);

16. recyslerview.setAdapter(adapter);

17. }

修改一下item的布局：

 

 

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

2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

3. android:layout_width="150dp"

4. android:layout_height="wrap_content"

5. android:orientation="vertical">

6.  

7. <ImageView

8. android:id="@+id/book_iamge"

9. android:layout_width="wrap_content"

10. android:layout_height="wrap_content"

11. android:layout_gravity="center_horizontal"/>

12.  

13. <TextView

14. android:id="@+id/book_name"

15. android:layout_width="match_parent"

16. android:layout_height="wrap_content"

17. android:layout_marginTop="10dp"

18. android:layout_gravity="center_horizontal"/>

19.  

20. </LinearLayout>

运行程序就可以发现我们实现了横向的滚动效果

 

 

3.瀑布流布局

RecyclerView除了LinearLayoutManager 之外，还提供了GridlayoutManager和StaggeredGridlayoutManager这两种内置的布局排列方式

GridlayoutManager可以用于实现网格布局

StaggeredGridlayoutManager可以用于实现瀑布流布局，

这里我们来实现一下炫酷的瀑布流布局：

修改item.xml的布局

 

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

2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

3. android:layout_width="match_parent"

4. android:layout_height="wrap_content"

5. android:layout_margin="5dp"

6. android:orientation="vertical">

7.  

8. <ImageView

9. android:id="@+id/book_iamge"

10. android:layout_width="wrap_content"

11. android:layout_height="wrap_content"

12. android:layout_gravity="center_horizontal"/>

13.  

14. <TextView

15. android:id="@+id/book_name"

16. android:layout_width="wrap_content"

17. android:layout_height="wrap_content"

18. android:layout_marginTop="5dp"

19. android:layout_gravity="left"/>

20.  

21. </LinearLayout>

onCreat方法：

 

 

1. @Override

2. protected void onCreate(Bundle savedInstanceState) {

3. super.onCreate(savedInstanceState);

4. setContentView(R.layout.activity_main);

5. //初始化List数据

6. initBook();

7. //初始化RecyclerView

8. RecyclerView recyslerview = (RecyclerView) findViewById(R.id.recycler_view);

9. //创建LinearLayoutManager 对象

10. /*

11. * 第一个参数表示布局的列数

12. * 第二个参数表示布局的方向，这里我们传入StaggeredGridLayoutManager.VERTICAL，表示布局纵向排列

13. */

14. StaggeredGridLayoutManager layoutmanager = new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);

15. //设置RecyclerView 布局

16. recyslerview.setLayoutManager(layoutmanager);

17. //设置Adapter

18. BookBaseAdapter adapter = new BookBaseAdapter(mlsit);

19. recyslerview.setAdapter(adapter);

20. }

 

仅仅修改一行代码，就可以成功的实现瀑布流的布局效果

 

点击监听事件这里引用  http://blog.csdn.net/dmk877/article/details/50816933 的方法

 

给RecyclerView的Item添加点击事件

   Item的点击事件RecyclerView监听事件处理在ListView使用的时候，该控件给我们提供一个onItemClickListener监听器，这样当我们点击Item的时候，会回调相关的方法，以便我们方便处理Item点击事件。对于RecyclerView来讲，非常可惜的是，该控件没有给我们提供这样的内置监听器方法，不过我们可以进行改造实现，可以这样实现Item的点击事件的监听，在我们的adapter中增加这两个方法

public interface OnItemClickListener{

        void onClick( int position);

        void onLongClick( int position);

     }

public void setOnItemClickListener(OnItemClickListener onItemClickListener ){

        this. mOnItemClickListener=onItemClickListener;

     }

然后onBindViewHolder方法要做如下更改

[java] view plain copy

  

1. @Override  
2.      public void onBindViewHolder(MyViewHolder holder, final int position) {  
3.              
4.            holder. tv.setText( mDatas.get(position));  
5.              
6.             if( mOnItemClickListener!= null){  
7.                 holder. itemView.setOnClickListener( new OnClickListener() {  
8.                        
9.                       @Override  
10.                       public void onClick(View v) {  
11.                            mOnItemClickListener.onClick(position);  
12.                      }  
13.                 });  
14.                   
15.                 holder. itemView.setOnLongClickListener( new OnLongClickListener() {  
16.                       @Override  
17.                       public boolean onLongClick(View v) {  
18.                            mOnItemClickListener.onLongClick(position);  
19.                             return false;  
20.                      }  
21.                 });  
22.            }  
23.      }<span style="color:#333333;">  
24. </span>  

 

在MainAcitivity中增加

[java] view plain copy

  

1. recycleAdapter.setOnItemClickListener(new OnItemClickListener() {  
2.                
3.               @Override  
4.               public void onLongClick(int position) {  
5.                    Toast.makeText(MainActivity.this,"onLongClick事件       您点击了第："+position+"个Item",0).show();  
6.               }  
7.                
8.               @Override  
9.               public void onClick(int position) {  
10.                    Toast.makeText(MainActivity.this,"onClick事件       您点击了第："+position+"个Item",0).show();  
11.               }  
12.          });