zoukankan      html  css  js  c++  java
  • RecyclerView的基本用法

    RecyclerView 是一个增强版的ListView,不仅可以实现和ListView同样的效果,还优化了ListView中存在的各种不足之处
    
    ResyslerView 能够实现横向滚动,这是ListView所不能实现的
    
    目前官方更加推荐使用RecyclerView.
    
    1.实现垂直方向的滚动
    
    在   dependencies 中添加库的引用
    
     
    [html] view plain copy
    
        dependencies {  
            compile fileTree(dir: 'libs', include: ['*.jar'])  
            testCompile 'junit:junit:4.12'  
            compile 'com.android.support:appcompat-v7:24.2.0'  
            compile 'com.android.support:recyclerview-v7:24.2.1'  
        }  
    
    
    添加布局文件:
    
     
    [html] view plain copy
    
        <?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.support.v7.widget.RecyclerView  
                android:id="@+id/recycler_view"  
                android:layout_width="match_parent"  
                android:layout_height="match_parent">  
            </android.support.v7.widget.RecyclerView>  
        </LinearLayout>  
    
    
    创建RecyclerView 适配器 BookBaseAdapter ,这个类继承 RecyclerView.Adapter 并将泛型指定为 BookBaseAdapter.ViewHolder
    
    其中ViewHolder是我们在 BookBaseAdapter 中定义的一个内部类:代码如下:
    
     
    [html] view plain copy
    
        public class BookBaseAdapter extends RecyclerView.Adapter<BookBaseAdapter.ViewHolder>{  
          
            private List<Book> mBookList;  
          
            static class ViewHolder extends RecyclerView.ViewHolder{  
                ImageView bookImage;  
                TextView bookname;  
          
                public ViewHolder(View view) {  
                    super(view);  
                    bookImage = (ImageView) view.findViewById(R.id.book_iamge);  
                    bookname = (TextView) view.findViewById(R.id.book_name);  
                }  
            }  
          
            public BookBaseAdapter(List<Book> mBookList) {  
                this.mBookList = mBookList;  
            }  
    
    [html] view plain copy
    
        <span style="white-space:pre;"> </span>//加载item 的布局  创建ViewHolder实例  
            @Override  
            public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {  
                View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.book,parent,false);  
                ViewHolder holder = new ViewHolder(view);  
                return holder;  
            }  
    
    [html] view plain copy
    
        <span style="white-space:pre;"> </span>//对RecyclerView子项数据进行赋值  
            @Override  
            public void onBindViewHolder(ViewHolder holder, int position) {  
                Book book = mBookList.get(position);  
                holder.bookname.setText(book.getName());  
                holder.bookImage.setImageResource(book.getImageId());  
            }  
    
    [html] view plain copy
    
        <span style="white-space:pre;"> </span>//返回子项个数  
            @Override  
            public int getItemCount() {  
                return mBookList.size();  
            }  
        }  
    
     
    
    MainActivity调用:
    [html] view plain copy
    
        public class MainActivity extends AppCompatActivity {  
          
            private List<Book> mlsit = new ArrayList<Book>();  
          
            @Override  
            protected void onCreate(Bundle savedInstanceState) {  
                super.onCreate(savedInstanceState);  
                setContentView(R.layout.activity_main);  
                //初始化List数据  
                initBook();  
                //初始化RecyclerView  
                RecyclerView recyslerview = (RecyclerView) findViewById(R.id.recycler_view);  
                //创建LinearLayoutManager 对象 这里使用 <span style="font-family:'Source Code Pro';">LinearLayoutManager 是线性布局的意思</span>  
                LinearLayoutManager layoutmanager = new LinearLayoutManager(this);  
                //设置RecyclerView 布局  
                recyslerview.setLayoutManager(layoutmanager);  
                //设置Adapter  
                BookBaseAdapter adapter = new BookBaseAdapter(mlsit);  
                recyslerview.setAdapter(adapter);  
            }  
          
            private void initBook(){  
                for (int i = 0; i < 10; i++) {  
                    Book book01 = new Book("Book"+i,R.drawable.icon01);  
                    mlsit.add(book01);  
                    Book book02 = new Book("Book"+i,R.drawable.icon02);  
                    mlsit.add(book02);  
                    Book book03 = new Book("Book"+i,R.drawable.icon03);  
                    mlsit.add(book03);  
                }  
            }  
        }  
    
    main_layout布局:
    [html] view plain copy
    
        <?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.support.v7.widget.RecyclerView  
                android:id="@+id/recycler_view"  
                android:layout_width="match_parent"  
                android:layout_height="match_parent">  
            </android.support.v7.widget.RecyclerView>  
        </LinearLayout>  
    
    
    
    item布局:
    [html] view plain copy
    
        <?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="wrap_content"  
                      android:orientation="horizontal">  
          
            <ImageView  
                android:id="@+id/book_iamge"  
                android:layout_width="wrap_content"  
                android:layout_height="wrap_content"/>  
          
            <TextView  
                android:id="@+id/book_name"  
                android:layout_width="match_parent"  
                android:layout_height="wrap_content"/>  
          
        </LinearLayout>  
    
    
    
    此处省略Book对象的相关源码。如上就可以实现和ListView一样的效果。
    
     
    
    2.实现横向滚动
    
    对垂直布局中的代码做小修改:
    
     
    
    onCreat方法中添加setOrientation()方法来设置布局的排列方向
    
     
    [html] view plain copy
    
        <span style="background-color:rgb(255,255,255);"> <span>    </span>layoutmanager.setOrientation(LinearLayoutManager.HORIZONTAL);</span>  
    
    
     
    [html] view plain copy
    
        @Override  
        protected void onCreate(Bundle savedInstanceState) {  
            super.onCreate(savedInstanceState);  
            setContentView(R.layout.activity_main);  
            //初始化List数据  
            initBook();  
            //初始化RecyclerView  
            RecyclerView recyslerview = (RecyclerView) findViewById(R.id.recycler_view);  
            //创建LinearLayoutManager 对象  
            LinearLayoutManager layoutmanager = new LinearLayoutManager(this);  
            layoutmanager.setOrientation(LinearLayoutManager.HORIZONTAL);  
            //设置RecyclerView 布局  
            recyslerview.setLayoutManager(layoutmanager);  
            //设置Adapter  
            BookBaseAdapter adapter = new BookBaseAdapter(mlsit);  
            recyslerview.setAdapter(adapter);  
        }  
    
    
    修改一下item的布局:
    
     
    [html] view plain copy
    
        <?xml version="1.0" encoding="utf-8"?>  
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
                      android:layout_width="150dp"  
                      android:layout_height="wrap_content"  
                      android:orientation="vertical">  
          
            <ImageView  
                android:id="@+id/book_iamge"  
                android:layout_width="wrap_content"  
                android:layout_height="wrap_content"  
                android:layout_gravity="center_horizontal"/>  
          
            <TextView  
                android:id="@+id/book_name"  
                android:layout_width="match_parent"  
                android:layout_height="wrap_content"  
                android:layout_marginTop="10dp"  
                android:layout_gravity="center_horizontal"/>  
          
        </LinearLayout>  
    
    
    运行程序就可以发现我们实现了横向的滚动效果
    
     
    
    3.瀑布流布局
    
    RecyclerView除了LinearLayoutManager 之外,还提供了GridlayoutManager和StaggeredGridlayoutManager这两种内置的布局排列方式
    
    GridlayoutManager可以用于实现网格布局
    
    StaggeredGridlayoutManager可以用于实现瀑布流布局,
    
    这里我们来实现一下炫酷的瀑布流布局:
    
    修改item.xml的布局
    
     
    [html] view plain copy
    
        <?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="wrap_content"  
                      android:layout_margin="5dp"  
                      android:orientation="vertical">  
          
            <ImageView  
                android:id="@+id/book_iamge"  
                android:layout_width="wrap_content"  
                android:layout_height="wrap_content"  
                android:layout_gravity="center_horizontal"/>  
          
            <TextView  
                android:id="@+id/book_name"  
                android:layout_width="wrap_content"  
                android:layout_height="wrap_content"  
                android:layout_marginTop="5dp"  
                android:layout_gravity="left"/>  
          
        </LinearLayout>  
    
    
    onCreat方法:
    
     
    [html] view plain copy
    
        @Override  
        protected void onCreate(Bundle savedInstanceState) {  
            super.onCreate(savedInstanceState);  
            setContentView(R.layout.activity_main);  
            //初始化List数据  
            initBook();  
            //初始化RecyclerView  
            RecyclerView recyslerview = (RecyclerView) findViewById(R.id.recycler_view);  
            //创建LinearLayoutManager 对象  
            /*  
             * 第一个参数表示布局的列数  
             * 第二个参数表示布局的方向,这里我们传入StaggeredGridLayoutManager.VERTICAL,表示布局纵向排列  
             */  
            StaggeredGridLayoutManager layoutmanager = new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);  
            //设置RecyclerView 布局  
            recyslerview.setLayoutManager(layoutmanager);  
            //设置Adapter  
            BookBaseAdapter adapter = new BookBaseAdapter(mlsit);  
            recyslerview.setAdapter(adapter);  
        }  
    
    
    仅仅修改一行代码,就可以成功的实现瀑布流的布局效果
    
     
    
    点击监听事件这里引用  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
     
     
     
     在CODE上查看代码片派生到我的代码片
    
        @Override  
             public void onBindViewHolder(MyViewHolder holder, final int position) {  
                     
                   holder. tv.setText( mDatas.get(position));  
                     
                    if( mOnItemClickListener!= null){  
                        holder. itemView.setOnClickListener( new OnClickListener() {  
                               
                              @Override  
                              public void onClick(View v) {  
                                   mOnItemClickListener.onClick(position);  
                             }  
                        });  
                          
                        holder. itemView.setOnLongClickListener( new OnLongClickListener() {  
                              @Override  
                              public boolean onLongClick(View v) {  
                                   mOnItemClickListener.onLongClick(position);  
                                    return false;  
                             }  
                        });  
                   }  
             }<span style="color:#333333;">  
        </span>  
    
    在MainAcitivity中增加
    [java] view plain copy
     
     
     
     在CODE上查看代码片派生到我的代码片
    
        recycleAdapter.setOnItemClickListener(new OnItemClickListener() {  
                       
                      @Override  
                      public void onLongClick(int position) {  
                           Toast.makeText(MainActivity.this,"onLongClick事件       您点击了第:"+position+"个Item",0).show();  
                      }  
                       
                      @Override  
                      public void onClick(int position) {  
                           Toast.makeText(MainActivity.this,"onClick事件       您点击了第:"+position+"个Item",0).show();  
                      }  
                 });
    
    参考文档:http://blog.csdn.net/dmk877/article/details/50816933
  • 相关阅读:
    memset()函数,多用于清空数组
    Echart 词云图 上手代码 同含(echarts-wordcloud.js)最简单的教程 复制可用
    爬虫使用真实浏览器打开网页进行爬取
    jsoup 模拟登陆github网页(源代码)亲测可用 直接复制就能用
    拷贝虚拟电脑 Ubuntu 系统 含hadoop hive hbase mysql spark eclipse
    Python 连接MySQL 增删改查 直接可用(最简易,含源码)
    Python 中文词频统计,热词统计,简要分析(含上手源码)
    百度百科简介爬取(含源代码、信息领域词频数据csv格式)
    博客园博文爬取 标签爬取(含源代码)
    输入一行电报文字,将字母变成其下一字母
  • 原文地址:https://www.cnblogs.com/Free-Thinker/p/8820231.html
Copyright © 2011-2022 走看看