2. 程式人生 > >Android5.0新控制元件——RecyclerView的使用全解

Android5.0新控制元件——RecyclerView的使用全解

阿新 • • 發佈：2019-01-04

介紹

RecyclerView與ListView原理是類似的：都是僅僅維護少量的View並且可以展示大量的資料集。RecyclerView用以下兩種方式簡化了資料的展示和處理:

使用LayoutManager來確定每一個item的排列方式。
為增加和刪除專案提供預設的動畫效果。
你也可以定義你自己的LayoutManager和新增刪除動畫，RecyclerView專案結構如下：
這裡寫圖片描述

Adapter：使用RecyclerView之前，你需要一個繼承自RecyclerView.Adapter的介面卡，作用是將資料與每一個item的介面進行繫結。
LayoutManager：用來確定每一個item如何進行排列擺放，何時展示和隱藏。回收或重用一個View的時候，LayoutManager會向介面卡請求新的資料來替換舊的資料，這種機制避免了建立過多的View和頻繁的呼叫findViewById方法（與ListView原理類似）。

目前SDK中提供了三種自帶的LayoutManager:

LinearLayoutManager
GridLayoutManager
StaggeredGridLayoutManager

recyclerView = (RecyclerView) findViewById(R.id.recyclerView);  
LinearLayoutManager layoutManager = new LinearLayoutManager(this );  
//設定佈局管理器  
recyclerView.setLayoutManager(layoutManager);  
//設定為垂直佈局，這也是預設的  
 

layoutManager.setOrientation(OrientationHelper. VERTICAL);  
//設定Adapter  
recyclerView.setAdapter( recycleAdapter);  
 //設定分隔線  
recyclerView.addItemDecoration( new DividerGridItemDecoration(this ));  
//設定增加或刪除條目的動畫  
recyclerView.setItemAnimator( new DefaultItemAnimator());

①onCreateViewHolder()
這個方法主要生成為每個Item inflater出一個View，但是該方法返回的是一個ViewHolder。該方法把View直接封裝在ViewHolder中，然後我們面向的是ViewHolder這個例項，當然這個ViewHolder需要我們自己去編寫。直接省去了當初的convertView.setTag(holder)和convertView.getTag()這些繁瑣的步驟。

②onBindViewHolder()
這個方法主要用於適配渲染資料到View中。方法提供給你了一個viewHolder，而不是原來的convertView。

③getItemCount()
這個方法就類似於BaseAdapter的getCount方法了，即總共有多少個條目。

這裡寫圖片描述

簡單的RecyclerView使用方法

1、新增依賴

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

2. 使用RecyclerView 

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

3.建立介面卡設定給RecyclerView 

View view = inflater.inflate(R.layout.fragment_home, container, false);
        //獲取rv控制元件
        RecyclerView rv = (RecyclerView) view.findViewById(R.id.rv);
        rv.setLayoutManager(new LinearLayoutManager(getContext()));
        //設定Adapter
        MyAdapter adapter = new MyAdapter();
        rv.setAdapter(adapter);
        return view;

4.建立介面卡

private class MyAdapter extends  RecyclerView.Adapter<MyHolder>{
        private final List<String> list;
        public MyAdapter(){
            list =  new ArrayList<String>();
            for (int i = 0; i < 30; i++) {
                list.add("商品記錄" + i)}

}
       //OnCreateViewHolder用來給rv建立快取的

     public MyHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            //引數3：判斷條件 true  1.是打氣 2.新增到parent
            View view = LayoutInflater.from(getContext()).inflate(R.layout.main_recyclerview_item,parent,false);
            MyHolder holder = new MyHolder(view);
            return holder;
        }
        //給快取控制元件設定資料
        public void onBindViewHolder(MyHolder holder, int position) {

            String item = list.get(position);
            holder.textView.setText(item);
            holder.icon.setImageResource(R.drawable.ic_default);
        }
        //獲取記錄數

  public int getItemCount() {
            return list.size();
      }

5.建立HolderView

public class MyHolder extends RecyclerView.ViewHolder {
    public ImageView icon;
    public TextView textView;
    //實現的方法
    public MyHolder(View itemView) {
        super(itemView);
        icon= (ImageView) itemView.findViewById(R.id.item_iv_icon);
        textView= (TextView) itemView.findViewById(R.id.item_tv_title);
    }
}

封裝RecyclerView通用介面卡

好處：1.數量動態 2.型別不限 Map<Integer，View>    
         作用：封裝了Adapter編寫的冗餘程式碼，提供簡潔的基類

思路：不寫死空間變數，而採用Map方式。
步驟：先關注比較火的控制元件庫 使用一下，看一下好處 學習下底層原始碼 自己動手體會
①封裝了BaseHolder 

//抽取BaseHolder繼承RecyclerView.ViewHolder
public class BaseHolder extends RecyclerView.ViewHolder {
    //不寫死控制元件變數，而採用Map方式
    private HashMap<Integer, View> mViews = new HashMap<>();
    public BaseHolder(View itemView) {
        super(itemView);
    }
    /**
     *獲取控制元件的方法
     */
    public<T> T getView(Integer viewId){
        //根據儲存變數的型別 強轉為該型別
        View view = mViews.get(viewId);
        if(view==null){
           view= itemView.findViewById(viewId);
            //快取
            mViews.put(viewId,view);
        }
        return (T)view;
    }
    /**
     *傳入文字控制元件id和設定的文字值，設定文字
     */
    public BaseHolder setText(Integer viewId, String value){
        TextView textView = getView(viewId);
        if (textView != null) {
            textView.setText(value);
        }
        return this;
    }
    /**
     * 傳入圖片控制元件id和資源id，設定圖片
     */
    public BaseHolder setImageResource(Integer viewId, Integer resId) {
        ImageView imageView = getView(viewId);
        if (imageView != null) {
            imageView.setImageResource(resId);
        }
        return this;
    }
    //...還可以擴展出各種控制元件。
    //Fluent API 鏈式api  obj.setxxx().setyyy()....
}

②Holder封裝好之後，再封裝BaseAdapter 

封裝的時候，部分引數可以選擇由外部的建構函式或者set方法
    public class BaseAdapter<T> extends RecyclerView.Adapter<BaseHolder> {
        private List<T> mList = new ArrayList<>();
        private int layoutId;
        public BaseAdapter(int layoutId,List<T> list){
            this.layoutId=layoutId;
            this. mList=list;
        }
        //onCreateViewHolder用來給rv建立快取
        @Override
        public BaseHolder onCreateViewHolder(ViewGroup parent, int viewType) {
           //引數3 判斷條件 true  1.打氣 2.新增到paraent
            // false 1.打氣 （參考parent的寬度）
            View view =   LayoutInflater.from(parent.getContext()).inflate(layoutId, parent, false);
            BaseHolder holder = new BaseHolder(view);
            return holder;
        }
       //onBindViewHolder給快取控制元件設定資料
        @Override
        public void onBindViewHolder(BaseHolder holder, int position) {
            T item = mList.get(position);
            convert(holder,item);
        }
    protected void convert(BaseHolder holder, T item) {
        //什麼都沒有做
    }
        //獲取記錄資料
        @Override
        public int getItemCount() {
            return mList.size();
        }
    }

③封裝之後，繼承實現

/**
 *1.extends  把父類的程式碼繼承過來。  可以少寫很多程式碼。
 *2.因為是全部拿來的程式碼，所以不是所有的程式碼都適合當前。對於不適合當前的程式碼（方法）
 * 我們可選擇@Override 覆蓋|重寫
 */
public class MyHomeAdapter extends BaseAdapter<String> {
    public MyHomeAdapter(List<String> list) {
        super(R.layout.main_recyclerview_item, list);
    }
    @Override
    protected void convert(BaseHolder holder, String item) {
        holder.setText(R.id.item_tv_title,item).setImageResource(R.id.image,R.drawable.ic_default);
    }
}

④封裝之後，程式碼實現

public class HomeFragment extends Fragment {
    private List<String> list;
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_home, container, false);
        //獲取rv控制元件
        RecyclerView rv = (RecyclerView) view.findViewById(R.id.rv); b
        rv.setLayoutManager(new LinearLayoutManager(getContext()));
        initData();
        //設定Adapter
        MyHomeAdapter adapter = new MyHomeAdapter(list);
        rv.setAdapter(adapter);
        return view;

案例1

依賴
佈局檔案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.support.v7.widget.RecyclerView
    android:id="@+id/id_recyclerview"
    android:divider="#FFB900"
    android:dividerHeight="1dp"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

</RelativeLayout>

讓我們來看看變化最大的Adaper:

class HomeAdapter extends RecyclerView.Adapter<HomeAdapter.MyViewHolder>
{
    private List<String> mList;
    private Context mContext;;
    public HomeAdapter(Context mContext,List<String>mList){
        this.mContext=mContext;
        this.mList=mList;
    }

    public void removeData(int position) {
        mList.remove(position);
        notifyItemRemoved(position);
    }
    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType)
    {
        MyViewHolder holder = new MyViewHolder(LayoutInflater.from(
                mContext).inflate(R.layout.item_recycler, parent,
                false));
        return holder;
    }

    @Override
    public void onBindViewHolder(final MyViewHolder holder, final int position)
    {
        holder.tv.setText(mList.get(position));
    }

    @Override
    public int getItemCount()
    {
        return mList.size();
    }

    class MyViewHolder extends RecyclerView.ViewHolder
    {

        TextView tv;
        public MyViewHolder(View view)
        {
            super(view);
            tv = (TextView) view.findViewById(R.id.tv_item);
        }
    }
}

最大的改進就是對ViewHolder進行了封裝定義，不用自己去自定義了，另外Adaper繼承RecyclerView.Adapter，在onCreateViewHolder載入條目佈局，在onBindViewHolder中將檢視與資料進行繫結。
佈局檔案item_recycler.xml：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:background="@android:color/white"
    android:layout_height="wrap_content"
    >

    <TextView
        android:id="@+id/tv_item"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center"
        android:text="moon" />
</FrameLayout>

這裡寫圖片描述

相關推薦

Android5.0新控制元件——RecyclerView的使用全解

介紹 RecyclerView與ListView原理是類似的：都是僅僅維護少量的View並且可以展示大量的資料集。RecyclerView用以下兩種方式簡化了資料的展示和處理: 使用LayoutManager來確定每一個item的排列方式。 為增加和刪除專

Android5.0新控制元件CardView的介紹和使用

<resources><declare-styleable name="CardView"><!-- Background color for CardView. --><!-- 背景色 --><attr name="cardBackgroundCol

android5.06.0新控制元件

Android自5.0後增加了不少新控制元件，幫助開發者實現了更酷更炫的UI效果。可是對於初學者來說，這些新控制元件的用法不像老控制元件那麼簡單，網上相關的使用介紹也不如老控制元件那樣豐富，種種情況無疑加大了

Android5.x 新控制元件之RecyclerView，CardView，Palette的使用

自Android5.0釋出以來，谷歌推出全新的Material Desigen設計風格，時過一年多了，在國內也看到很多應用在慢 慢適應MD設計風格。其中比較好的app就是網易新聞客戶端了，其設計風格基本符合MD要求。鑑於越來多App採 用MD設計風格，作

Android 4.0新控制元件 switch的屬性

<style name="widget_gender_switch">         <item name="android:layout_height">wrap_content</item>  

Android6.0-新控制元件(一)

前言 谷歌在2015年I/O大會上釋出了Android M的新版本.在這次的I/O大會上,谷歌對Android並沒有做很大的改變,主要完善之前的Android L版本.不過這次谷歌在繼Material Design風格之後,做了很多風格上的相容,並推出

Android5.0新元件TabLayout+ViewPager實現Tab頁面

本來算是個雞肋的東西，但是design相容包釋出之後情況就大不一樣了。 下面看程式碼： 首先在gradle中新增依賴 dependencies { compile fileTree(incl

ext3.0 樹控制元件處理

前幾個月，一直在學習ext，並用它做了個專案，其中涉及到大量的樹列表的建立，動態修改。現在不忙了，總結出來： //建立節點 root為樹的根節點，node當前要加入的節點，nodeArray所有的樹節點（可以不包括根節點） checked表示樹節點是否加入check框，帶check框的節點都

安卓常用控制元件RecyclerView+HorizontalScrollView實現item側滑效果 安卓常用控制元件RecyclerView+HorizontalScrollView實現item側滑效果

原 安卓常用控制元件RecyclerView+HorizontalScrollView實現item側滑效果 2017年10月28日 12:23:14 低-調

HTML5新控制元件 - 數值輸入框

1，預設只能輸入整數 <input type="number"/> 2，使用step屬性表示可以接受的數值間隔（比如下面就允許輸入11.5） <input type="number" step="0.1"/> 3，使用min和max

Android開發之基本控制元件和詳解四種佈局方式

Android中的控制元件的使用方式和iOS中控制元件的使用方式基本相同，都是事件驅動。給控制元件新增事件也有介面回撥和委託代理的方式。今天這篇部落格就總結一下Android中常用的基本控制元件以及佈局方式。說到佈局方式Android和iOS還是區別挺大的，在iOS中有F

Android開發的之基本控制元件和詳解四種佈局方式

Android中的控制元件的使用方式和iOS中控制元件的使用方式基本相同，都是事件驅動。給控制元件新增事件也有介面回撥和委託代理的方式。今天這篇部落格就總結一下Android中常用的基本控制元件以及佈局方式。說到佈局方式Android和iOS還是區別挺大的，在iOS中有Frame絕對佈局和AutoL

android開發之wheel控制元件使用詳解

出門在外生不起病呀，隨便兩盒藥60多塊錢。好吧，不廢話了，今天我們來看看wheel控制元件的使用，這是GitHub上的一個開源控制元件，用起來十分方便，我們可以用它做許多事情，比如做一個自定義的datepicker，在一些電商App中，經常用它來做省市縣三級聯動，總之用途還是

最強大的滾動控制元件————RecyclerView

首先先接受另外一個相似的滾動控制元件的ListView ---- 的的ListView控制元件的侷限性： 需要使用一些技巧來提升它的執行效率，否則效能會非常差;  的ListView的控制元件中的只能實現縱向滾動，不能實現橫向滾動，以及網格和瀑布流佈局;  

Android控制元件RecyclerView與ListView的異同

在我的一篇介紹Android新控制元件RecyclerView的部落格（Android L新控制元件RecyclerView簡介）中，一個讀者留言說RecyclerView跟ListView之間好像沒有什麼不同，我覺得這是一個好問題，應該明確地區分一下兩者的睯，所以我就研究了一下它倆之間的區別，然後也對兩者的

VS2010中新控制元件的程式設計------顏色按鈕類和顏色對話方塊

（1）      顏色按鈕類和顏色對話方塊 1） 顏色對話方塊 MFC提供了顏色對話方塊類CMFCColorDialog進行顏色的選擇，系統可以利用DoModal（）呼叫，然後選擇相應的顏色。 CMFCColorDialog dlg(m_Color,0, this);   

WPF自定義控制元件之圖形解鎖控制元件 ScreenUnLock

原文: WPF自定義控制元件之圖形解鎖控制元件 ScreenUnLock ScreenUnLock 與智慧手機上的圖案解鎖功能一樣。通過繪製圖形達到解鎖或記憶圖形的目的。 本人突發奇想，把手機上的圖形解鎖功能移植到WPF中。也應用到了公司的專案中。 在建立ScreenUnLock之前，先來分析一下圖形解

日曆控制元件--MaterialCalendarView 詳解

專案中遇到了日曆選擇的模組,經過搜尋,發現了一個比較好用的日曆控制元件MaterialCalendarView 下面講講它的基本用法. 首先對他新增依賴 compile 'com.prolificinteractive:material-calenda

Android控制元件RecyclerView實現橫向滑動、瀑布流。

在開發的過程中，我們經常使用ListView控制元件，但是ListView也有它的缺點，就是它不能夠左右滑動資料，執行效率不高； 所以我們可以使用更強大的控制元件RecyclerView，可以說它是一個增強版的ListView，Google推薦使用，那就簡單的

Asp.net控制元件集了解

前言      在學習Asp.net視訊中，小編接觸到了ASP.net的四個控制元件集，於是乎對於每一個控制元件集中包含的控制元件有了興趣，所以呢，在查詢的過程中發現這個問題也是一個ASP.NET的面