你必須瞭解的RecyclerView的五大開源項目-解決上拉加載、下拉刷新和添加Header、Footer等問題

前段時間作項目因爲採用的MD設計，因此必需要使用RecyclerView全面代替ListView。可是開發中遇到了須要實現RecyclerView上拉加載、下拉刷新和添加Header以及Footer等需求問題，現將問題解決中用到的五大開源項目總結下來，方便他人。

• 1
• 2

首先介紹下RecyclerView，RecyclerView相比ListView增長了不少新特性：

• Adapter中的ViewHolder模式 - 對於ListView來講，經過建立ViewHolder來提高性能並非必須的。由於ListView並無嚴格的ViewHolder設計模式。可是在使用RecyclerView的時候，Adapter必須實現至少一個ViewHolder，必須遵循ViewHolder設計模式。 
• 定製Item條目 - ListView只能實現垂直線性排列的列表視圖，與之不一樣的是，RecyclerView能夠經過設置RecyclerView.LayoutManager來定製不一樣風格的視圖，好比水平滾動列表或者不規則的瀑布流列表。 
• Item動畫 - 在ListView中沒有提供任何方法或者接口，方便開發者實現Item的增刪動畫。相反地，能夠經過設置RecyclerView的RecyclerView.ItemAnimator來爲條目增長動畫效果。 
• 設置數據源 - 在LisView中針對不一樣數據封裝了各類類型的Adapter，好比用來處理數組的ArrayAdapter和用來展現Database結果的CursorAdapter。相反地，在RecyclerView中必須自定義實現RecyclerView.Adapter併爲其提供數據集合。 
• 設置條目分割線 - 在ListView中能夠經過設置android:divider屬性來爲兩個Item間設置分割線。若是想爲RecyclerView添加此效果，則必須使用RecyclerView.ItemDecoration，這種實現方式不只更靈活，並且樣式也更加豐富。 
• 設置點擊事件 - 在ListView中存在AdapterView.OnItemClickListener接口，用來綁定條目的點擊事件。可是，很遺憾的是在RecyclerView中，並無提供這樣的接口，不過，提供了另一個接口RcyclerView.OnItemTouchListener，用來響應條目的觸摸事件。 
可是……，RecyclerView不像ListView那樣擁有Header和Footer，所以開發中須要咱們本身去實現Header和Foote，另外開發中小夥伴們常用的PullToRefresh庫暫時又不支持RecyclerView。和身邊的不少小夥們同樣，我也陷入了困境，爲了避免拖累項目進度，我決定親自解（shi）決（yong）難（kai）題（yuan），作一個伸手黨。

如今將我發現的GitHub上優秀的Header、Footer、上拉加載和下拉刷新解決方案彙總以下：

• 1
• 2

（一） SwipeToLoadLayout-推薦使用

GitHub地址：https://github.com/Aspsine/SwipeToLoadLayout

SwipeToLoadLayout支持YouTube、Google、京東等多家APP基於RecyclerView的上拉加載和下拉刷新樣式，，好用的不要不要的。廢話很少說，直接上圖：

• 1
• 2

• ListView & GridView

• RecyclerView(With all kinds of layoutManagers)

• WebView & ScrollView & Other Views

• Google SwipeRefreshLayout style

• 京東style

• Yalantis Phoenix 樣式

AndroidStudio配置方法

第一步：在你的build.gradle添加JitPack庫在 
repositories { 
maven { url 「https://jitpack.io」 } 
}

第二部：添加依賴庫 
dependencies { 
compile ‘com.github.Aspsine:SwipeToLoadLayout:v1.0.2’ 
}

（二） UltimateRecyclerView-大名鼎鼎

GitHub地址：https://github.com/cymcsg/UltimateRecyclerView

UltimateRecyclerView是解決RecyclerView下拉刷新，加載更多，增長頭部，顯示或隱藏工具欄等許多問題的知名開源框架。

• 1
• 2

包含特性以下： 
• Swipe to refresh(using android.support.v4.widget.SwipeRefreshLayout) 
• Many kinds of animations 
• Swipe to dismiss 
• Parallax or normal head view 
• Drag and drop items 
• Loading more when reach the last item(infinite scrolling) 
• Custom views in loading more 
• Showing or hiding toolbar and floating button when scrolling 
• Scrollbars 
• Colorful styles of swipe to refresh 
• Sticky header like instagram 
• Support different layout in adapter 
• Loading adapter with animation

使用效果以下：

AndroidStudio配置方法

第一步：在你的build.gradle添加庫

repositories {
    jcenter()
    maven { url "http://dl.bintray.com/jjhesk/maven" }
    }

• 1
• 2
• 3
• 4

第二步：添加依賴庫

dependencies{
    compile 'com.hkm.slidingmenulib:libmenu:0.4.9'
}

• 1
• 2
• 3

第三步：佈局文件中使用方法

<com.marshalchen.ultimaterecyclerview.UltimateRecyclerView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/ultimate_recycler_view"
/>

• 1
• 2
• 3
• 4
• 5

（三） IRecyclerView-效果最炫

GitHub地址：https://github.com/Aspsine/IRecyclerView

IRecyclerView支持RecyclerView下拉刷新，上拉加載，定製Header和Footer。

• 1
• 2

包含特性以下： 
• pull-to-refresh 
• pull-to-loadmore 
• customize refresh header 
• customize loadmore footer 
• add multiple header view 
• add multiple footer view

使用效果以下： 
刷新效果 

AndroidStudio配置方法 
第一步：在你的build.gradle添加庫

repositories:
allprojects {
    repositories {
        ...
        maven { url "https://jitpack.io" }
    }
}

• 1
• 2
• 3
• 4
• 5
• 6
• 7

第二步：添加依賴庫

dependencies {
    compile 'com.github.Aspsine:IRecyclerView:0.0.2'
}

• 1
• 2
• 3

第三步：佈局文件中使用方法

<com.aspsine.irecyclerview.IRecyclerView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/iRecyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:loadMoreEnabled="true"
    app:loadMoreFooterLayout="@layout/layout_irecyclerview_load_more_footer"
    app:refreshEnabled="true"
    app:refreshHeaderLayout="@layout/layout_irecyclerview_refresh_header"/>

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9

第四步：Activity/Fragment中使用

IRecyclerView iRecyclerView = (IRecyclerView) findViewById(R.id.iRecyclerView);

iRecyclerView.setLayoutManager(new LinearLayoutManager(this));

// an custom footer view, you can customize it yourself.
LoadMoreFooterView loadMoreFooterView = (LoadMoreFooterView) iRecyclerView.getLoadMoreFooterView();

// you can also add header and footer like this
// note: header and refresh header are different, footer and load more footer are different too. 
iRecyclerView.addHeaderView(headerView);
iRecyclerView.addFooterView(footerView);

// adapter
ImageAdapter mAdapter = new ImageAdapter();
// note: here use setIAdapter(...) method not setAdapter(...)
iRecyclerView.setIAdapter(mAdapter);

iRecyclerView.setOnRefreshListener(new OnRefreshListener() {
    @Override
    public void onRefresh() {

    }
});
iRecyclerView.setOnLoadMoreListener(new OnLoadMoreListener() {
    @Override
    public void onLoadMore(View loadMoreView) {

    }
});

// set auto refreshing
iRecyclerView.post(new Runnable() {
    @Override
   public void run() {
       iRecyclerView.setRefreshing(true);
   }
});

// stop refreshing
iRecyclerView.setRefreshing(false);

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40

（四）PullLoadMoreRecyclerView-屬性最全

GitHub地址：https://github.com/WuXiaolong/PullLoadMoreRecyclerView

PullLoadMoreRecyclerView實現了RecyclerView下拉刷新和上拉加載更多以及RecyclerView線性、網格、瀑布流效果。

• 1
• 2

效果圖以下：

使用方法 
build.gradle文件

dependencies {
  compile 'com.wuxiaolong.pullloadmorerecyclerview:library:1.0.4'
}

• 1
• 2
• 3

xml引用

<com.wuxiaolong.pullloadmorerecyclerview.PullLoadMoreRecyclerView
        android:id="@+id/pullLoadMoreRecyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="10dp" />

• 1
• 2
• 3
• 4
• 5

設置線性佈局

mPullLoadMoreRecyclerView = (PullLoadMoreRecyclerView) view.findViewById(R.id.pullLoadMoreRecyclerView);
 mPullLoadMoreRecyclerView.setLinearLayout();

• 1
• 2

設置網格佈局

mPullLoadMoreRecyclerView.setGridLayout(2);//參數爲列數

• 1

設置交錯網格佈局，即瀑布流效果

mPullLoadMoreRecyclerView.setStaggeredGridLayout(2);//參數爲列數

• 1

綁定適配器

mRecyclerViewAdapter = new RecyclerViewAdapter();
mPullLoadMoreRecyclerView.setAdapter(mRecyclerViewAdapter);

public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder> {

    public RecyclerViewAdapter() {

    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.recycler_view_item, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {

    }

    @Override
    public int getItemCount() {
        return 0;
    }

    public class ViewHolder extends RecyclerView.ViewHolder {     

        public ViewHolder(View itemView) {
            super(itemView);

        }
    }
}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33

調用下拉刷新和加載更多

mPullLoadMoreRecyclerView.setOnPullLoadMoreListener(new PullLoadMoreRecyclerView.PullLoadMoreListener() {
            @Override
            public void onRefresh() {

            }

            @Override
            public void onLoadMore() {               

            }
        });

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11

刷新結束

mPullLoadMoreRecyclerView.setPullLoadMoreCompleted();

• 1

不須要下拉刷新

mPullLoadMoreRecyclerView.setPullRefreshEnable(false);

• 1

不須要上拉刷新

mPullLoadMoreRecyclerView.setPushRefreshEnable(false);

• 1

設置上拉刷新文字

mPullLoadMoreRecyclerView.setFooterViewText("loading");

• 1

設置下拉刷新顏色

mPullLoadMoreRecyclerView.setColorSchemeResources(android.R.color.holo_red_dark,android.R.color.holo_blue_dark);

• 1

快速Top

mPullLoadMoreRecyclerView.scrollToTop();

• 1

（五）HeaderAndFooterRecyclerView-封裝完善

GitHub地址：https://github.com/cundong/HeaderAndFooterRecyclerView

HeaderAndFooterRecyclerView是支持addHeaderView、 addFooterView、分頁加載的RecyclerView解決方案。它能夠對 RecyclerView 控件進行拓展（經過RecyclerView.Adapter實現），給RecyclerView增長HeaderView、FooterView，而且不須要對你的具體業務邏輯Adapter作任何修改。同時，經過修改 FooterView State，能夠動態 FooterView 賦予不一樣狀態（加載中、加載失敗、滑到最底等），能夠實現 RecyclerView 分頁加載數據時的 Loading/TheEnd/NetWorkError 效果。

• 1
• 2

• 添加HeaderView、FooterView 
mHeaderAndFooterRecyclerViewAdapter = new HeaderAndFooterRecyclerViewAdapter(mDataAdapter); 
mRecyclerView.setAdapter(mHeaderAndFooterRecyclerViewAdapter);

mRecyclerView.setLayoutManager(new LinearLayoutManager(this));

    //add a HeaderView
    RecyclerViewUtils.setHeaderView(mRecyclerView, new SampleHeader(this));

    //add a FooterView
    RecyclerViewUtils.setFooterView(mRecyclerView, new SampleFooter(this));

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8

• LinearLayout/GridLayout/StaggeredGridLayout佈局的RecyclerView分頁加載 
mRecyclerView.addOnScrollListener(mOnScrollListener); 
private EndlessRecyclerOnScrollListener mOnScrollListener = new EndlessRecyclerOnScrollListener() {

@Override
    public void onLoadNextPage(View view) {
        super.onLoadNextPage(view);

        LoadingFooter.State state = RecyclerViewStateUtils.getFooterViewState(mRecyclerView);
        if(state == LoadingFooter.State.Loading) {
            Log.d("@Cundong", "the state is Loading, just wait..");
            return;
        }

        mCurrentCounter = mDataList.size();

        if (mCurrentCounter < TOTAL_COUNTER) {
            // loading more
            RecyclerViewStateUtils.setFooterViewState(EndlessLinearLayoutActivity.this, mRecyclerView, REQUEST_COUNT, LoadingFooter.State.Loading, null);
            requestData();
        } else {
            //the end
            RecyclerViewStateUtils.setFooterViewState(EndlessLinearLayoutActivity.this, mRecyclerView, REQUEST_COUNT, LoadingFooter.State.TheEnd, null);
        }
    }
};

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23

注意事項

若是已經使用 RecyclerViewUtils.setHeaderView(mRecyclerView, view); 爲RecyclerView添加了HeaderView，那麼再調用ViewHolder類的getAdapterPosition()、getLayoutPosition()時返回的值就會由於增長了Header而受影響（返回的position等於真實的position+headerCounter）。
所以，這種狀況下請使用 RecyclerViewUtils.getAdapterPosition(mRecyclerView, ViewHolder.this)、RecyclerViewUtils.getLayoutPosition(mRecyclerView, ViewHolder.this) 兩個方法來替代。
使用效果：

• 1
• 2
• 3
• 4

• 添加HeaderView、FooterView

• 支持分頁加載的LinearLayout佈局RecyclerView

• 支持分頁加載的GridLayout佈局RecyclerView

• 支持分頁加載的StaggeredGridLayout佈局RecyclerView

• 分頁加載失敗時的GridLayout佈局RecyclerView

以上就是GitHub中比較好的RecyclerView開源框架，但願能對小夥伴們的開發帶來幫助，更感謝這些做者們提供了這麼好的東西！