RecyclerView實現多type頁面

目錄介紹

01.先看看實際需求
02.adapter實現多個type
03.這樣寫的弊端
04.如何優雅實現adapter封裝

好消息

博客筆記大彙總【16年3月到至今】，包括Java基礎及深入知識點，Android技術博客，Python學習筆記等等，還包括平時開發中遇到的bug彙總，當然也在工作之餘收集了大量的面試題，長期更新維護並且修正，持續完善……開源的文件是markdown格式的！同時也開源了生活博客，從12年起，積累共計N篇[近100萬字，陸續搬到網上]，轉載請註明出處，謝謝！
鏈接地址：https://github.com/yangchong2...
如果覺得好，可以star一下，謝謝！當然也歡迎提出建議，萬事起於忽微，量變引起質變！

01.先看看實際需求

比如一個APP的首頁，包含Banner區、廣告區、文本內容、圖片內容、新聞內容等等。
RecyclerView 可以用ViewType來區分不同的item,也可以滿足需求，但還是存在一些問題，比如：
- 1，在item過多邏輯複雜列表界面，Adapter裏面的代碼量龐大，邏輯複雜，後期難以維護。
- 2，每次增加一個列表都需要增加一個Adapter，重複搬磚，效率低下。
- 3，無法複用adapter，假如有多個頁面有多個type，那麼就要寫多個adapter。
- 4，要是有局部刷新，那麼就比較麻煩了，比如廣告區也是一個九宮格的RecyclerView，點擊局部刷新當前數據，比較麻煩。

02.adapter實現多個type

通常寫一個多Item列表的方法
- 根據不同的ViewType 處理不同的item，如果邏輯複雜，這個類的代碼量是很龐大的。如果版本迭代添加新的需求，修改代碼很麻煩，後期維護困難。
主要操作步驟
- 在onCreateViewHolder中根據viewType參數，也就是getItemViewType的返回值來判斷需要創建的ViewHolder類型
- 在onBindViewHolder方法中對ViewHolder的具體類型進行判斷，分別爲不同類型的ViewHolder進行綁定數據與邏輯處理

代碼如下所示

public class HomePageAdapter extends RecyclerView.Adapter {
    public static final int TYPE_BANNER = 0;
    public static final int TYPE_AD = 1;
public static final int TYPE_TEXT = 2;
    public static final int TYPE_IMAGE = 3;
    public static final int TYPE_NEW = 4;
    private List<HomePageEntry> mData;

    public void setData(List<HomePageEntry> data) {
        mData = data;
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        switch (viewType){
            case TYPE_BANNER:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_banner_layout,null));
            case TYPE_AD:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_ad_item_layout,null));
            case TYPE_TEXT:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_text_item_layout,null));
            case TYPE_IMAGE:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_image_item_layout,null));
            case TYPE_NEW:
                return new BannerViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.home_news_item_layout,null));
        }
        return null;
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        int type = getItemViewType(position);
        switch (type){
            case TYPE_BANNER:
                // banner 邏輯處理
                break;
            case TYPE_AD:
                // 廣告邏輯處理
                break;
            case TYPE_TEXT:
                // 文本邏輯處理
                break;
            case TYPE_IMAGE:
               //圖片邏輯處理
                break;
            case TYPE_NEW:
                //視頻邏輯處理
                break;
            // ... 此處省去N行代碼
        }
    }

    @Override
    public int getItemViewType(int position) {
        if(position == 0){
            return TYPE_BANNER;//banner在開頭
        }else {
            return mData.get(position).type;//type 的值爲TYPE_AD，TYPE_IMAGE，TYPE_AD，等其中一個
        }

    }

    @Override
    public int getItemCount() {
        return mData == null ? 0:mData.size();
    }



    public static class BannerViewHolder extends RecyclerView.ViewHolder{

        public BannerViewHolder(View itemView) {
            super(itemView);
            //綁定控件
        }
    }

    public static class NewViewHolder extends RecyclerView.ViewHolder{

        public VideoViewHolder(View itemView) {
            super(itemView);
            //綁定控件
        }
    }
    public static class AdViewHolder extends RecyclerView.ViewHolder{

        public AdViewHolder(View itemView) {
            super(itemView);
            //綁定控件
        }
    }
    public static class TextViewHolder extends RecyclerView.ViewHolder{

        public TextViewHolder(View itemView) {
            super(itemView);
            //綁定控件
        }
    }
    public static class ImageViewHolder extends RecyclerView.ViewHolder{

        public ImageViewHolder(View itemView) {
            super(itemView);
            //綁定控件
        }
    }
}

03.這樣寫的弊端

上面那樣寫的弊端
- 類型檢查與類型轉型，由於在onCreateViewHolder根據不同類型創建了不同的ViewHolder，所以在onBindViewHolder需要針對不同類型的ViewHolder進行數據綁定與邏輯處理，這導致需要通過instanceof對ViewHolder進行類型檢查與類型轉型。
- 不利於擴展，目前的需求是列表中存在5種佈局類類型，那麼如果需求變動，極端一點的情況就是數據源是從服務器獲取的，數據中的model決定列表中的佈局類型。這種情況下，每當model改變或model類型增加，我們都要去改變adapter中很多的代碼，同時Adapter還必須知道特定的model在列表中的位置（position）除非跟服務端約定好，model（位置）不變，很顯然，這是不現實的。
- 不利於維護，這點應該是上一點的延伸，隨着列表中佈局類型的增加與變更，getItemViewType、onCreateViewHolder、onBindViewHolder中的代碼都需要變更或增加，Adapter 中的代碼會變得臃腫與混亂，增加了代碼的維護成本。

04.如何優雅實現adapter封裝

核心目的就是三個
- 避免類的類型檢查與類型轉型
- 增強Adapter的擴展性
- 增強Adapter的可維護性
當列表中類型增加或減少時Adapter中主要改動的就是getItemViewType、onCreateViewHolder、onBindViewHolder這三個方法，因此，我們就從這三個方法中開始着手。
既然可能存在多個type類型的view，那麼能不能把這些比如banner，廣告，文本，視頻，新聞等當做一個HeaderView來操作。

在getItemViewType方法中。

減少if之類的邏輯判斷簡化代碼，可以簡單粗暴的用hashCode作爲增加type標識。
通過創建列表的佈局類型，同時返回的不再是簡單的佈局類型標識，而是佈局的hashCode值

private ArrayList<InterItemView> headers = new ArrayList<>();
    
public interface InterItemView {

    /**
     * 創建view
     * @param parent            parent
     * @return                  view
     */
    View onCreateView(ViewGroup parent);
    
    /**
     * 綁定view
     * @param headerView        headerView
     */
    void onBindView(View headerView);
}
    
/**
 * 獲取類型，主要作用是用來獲取當前項Item(position參數)是哪種類型的佈局
 * @param position                      索引
 * @return                              int
 */
@Deprecated
@Override
public final int getItemViewType(int position) {
    if (headers.size()!=0){
        if (position<headers.size()) {
            return headers.get(position).hashCode();
        }
    }
    if (footers.size()!=0){
        int i = position - headers.size() - mObjects.size();
        if (i >= 0){
            return footers.get(i).hashCode();
        }
    }
    return getViewType(position-headers.size());
}

onCreateViewHolder

getItemViewType返回的是佈局hashCode值，也就是onCreateViewHolder(ViewGroup parent, int viewType)參數中的viewType

/**
 * 創建viewHolder，主要作用是創建Item視圖，並返回相應的ViewHolder
 * @param parent                        parent
 * @param viewType                      type類型
 * @return                              返回viewHolder
 */
@NonNull
@Override
public final BaseViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
    View view = createViewByType(parent, viewType);
    if (view!=null){
        return new BaseViewHolder(view);
    }
    final BaseViewHolder viewHolder = OnCreateViewHolder(parent, viewType);
    setOnClickListener(viewHolder);
    return viewHolder;
}

private View createViewByType(ViewGroup parent, int viewType){
    for (InterItemView headerView : headers){
        if (headerView.hashCode() == viewType){
            View view = headerView.onCreateView(parent);
            StaggeredGridLayoutManager.LayoutParams layoutParams;
            if (view.getLayoutParams()!=null) {
                layoutParams = new StaggeredGridLayoutManager.LayoutParams(view.getLayoutParams());
            } else {
                layoutParams = new StaggeredGridLayoutManager.LayoutParams(
                        ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
            }
            layoutParams.setFullSpan(true);
            view.setLayoutParams(layoutParams);
            return view;
        }
    }
    for (InterItemView footerView : footers){
        if (footerView.hashCode() == viewType){
            View view = footerView.onCreateView(parent);
            StaggeredGridLayoutManager.LayoutParams layoutParams;
            if (view.getLayoutParams()!=null) {
                layoutParams = new StaggeredGridLayoutManager.LayoutParams(view.getLayoutParams());
            } else {
                layoutParams = new StaggeredGridLayoutManager.LayoutParams(
                        ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
            }
            layoutParams.setFullSpan(true);
            view.setLayoutParams(layoutParams);
            return view;
        }
    }
    return null;
}

在onBindViewHolder方法中。可以看到，在此方法中，添加一種header類型的view，則通過onBindView進行數據綁定。

/**
 * 綁定viewHolder，主要作用是綁定數據到正確的Item視圖上。當視圖從不可見到可見的時候，會調用這個方法。
 * @param holder                        holder

 */
@Override
public final void onBindViewHolder(BaseViewHolder holder, int position) {
    holder.itemView.setId(position);
    if (headers.size()!=0 && position<headers.size()){
        headers.get(position).onBindView(holder.itemView);
        return ;
    }

    int i = position - headers.size() - mObjects.size();
    if (footers.size()!=0 && i>=0){
        footers.get(i).onBindView(holder.itemView);
        return ;
    }
    OnBindViewHolder(holder,position-headers.size());
}
```

如何使用，如下所示，這個就是banner類型，可以說是解耦了之前adapter中複雜的操作

InterItemView interItemView = new InterItemView() {
    @Override
    public View onCreateView(ViewGroup parent) {
        BannerView header = new BannerView(HeaderFooterActivity.this);
        header.setHintView(new ColorPointHintView(HeaderFooterActivity.this,
                Color.YELLOW, Color.GRAY));
        header.setHintPadding(0, 0, 0, (int) AppUtils.convertDpToPixel(
                8, HeaderFooterActivity.this));
        header.setPlayDelay(2000);
        header.setLayoutParams(new RecyclerView.LayoutParams(
                ViewGroup.LayoutParams.MATCH_PARENT,
                (int) AppUtils.convertDpToPixel(200, HeaderFooterActivity.this)));
        header.setAdapter(new BannerAdapter(HeaderFooterActivity.this));
        return header;
    }

    @Override
    public void onBindView(View headerView) {

    }
};
adapter.addHeader(interItemView);

封裝後好處
- 拓展性——Adapter並不關心不同的列表類型在列表中的位置，因此對於Adapter來說列表類型可以隨意增加或減少。十分方便，同時設置類型view的佈局和數據綁定都不需要在adapter中處理。充分解耦。
- 可維護性——不同的列表類型由adapter添加headerView處理，哪怕添加多個headerView，相互之間互不干擾，代碼簡潔，維護成本低。

其他介紹

01.關於博客彙總鏈接

02.關於我的博客

我的個人站點：www.yczbj.org，www.ycbjie.cn
github：https://github.com/yangchong211
知乎：https://www.zhihu.com/people/...
簡書：http://www.jianshu.com/u/b7b2...
csdn：http://my.csdn.net/m0_37700275
喜馬拉雅聽書：http://www.ximalaya.com/zhubo...
開源中國：https://my.oschina.net/zbj161...
泡在網上的日子：http://www.jcodecraeer.com/me...
郵箱：[email protected]
阿里雲博客：https://yq.aliyun.com/users/a... 239.headeruserinfo.3.dT4bcV
segmentfault頭條：https://segmentfault.com/u/xi...
掘金：https://juejin.im/user/593943...

RecyclerView實現多type頁面

目錄介紹

好消息

01.先看看實際需求

02.adapter實現多個type

03.這樣寫的弊端

04.如何優雅實現adapter封裝

其他介紹

01.關於博客彙總鏈接

02.關於我的博客

項目案例地址：https://github.com/yangchong2...

關於遊戲付費的一點想法

我通過CKA和CKS啦！

Android打造萬能自定義陰影控件

Activity系列博客5篇

Android狀態管理優化

Kotlin可控性探索

Android保存多張圖片到本地

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結