Android開源：SmartRefreshLayout－智能下拉刷新框架

lillc369 7年前發布 | 30K 次閱讀安卓開發 Android開發移動開發

?正如名字所說，這是一個“聰明的下拉刷新布局”，由于它的聰明，他不只是如其他的刷新布局所說的支持所有的View，還支持多層嵌套的視圖結構，下文會對這個詳細說明。

??除了“聰明”之外，SmartRefreshLayout還具備了很多的特點。它繼承至ViewGroup 而不是其他的Layout，提高了性能。

??吸取了現在流行的各種刷新布局的優點，包括谷歌官方的 SwipeRefreshLayout，現在非常流行的 TwinklingRefreshLayout 、android-Ultra-Pull-To-Refresh。還集成了各種炫酷的 Header 和 Footer。

??下面列出了SmartRefreshLayout所有的特點功能:

支持所有的 View（AbsListView、RecyclerView、WebView....View）和多層嵌套的 Layout（詳細）
支持自定義并且已經集成了很多炫酷的 Header 和 Footer （圖）.
支持和ListView的同步滾動和 RecyclerView、AppBarLayout、CoordinatorLayout 的嵌套滾動 NestedScrolling.
支持在Android Studio Xml 編輯器中預覽效果（圖）
支持分別在 Default（默認）、Xml、JavaCode、中設置 Header 和 Footer.
支持自動刷新、自動上拉加載（自動檢測列表滾動到底部，而不用手動上拉）.
支持通用的刷新監聽器 OnRefreshListener 和更詳細的滾動監聽 OnMultiPurposeListener.
支持自定義回彈動畫的插值器，實現各種炫酷的動畫效果.
支持設置主題來適配任何場景的App，不會出現炫酷但很尷尬的情況.
支持設置多種滑動方式來適配各種效果的Header和Footer：位置平移、尺寸拉伸、背后固定、頂層固定、全屏
支持內容尺寸自適應 Content-wrap_content
支持繼承重寫和擴展功能，內部實現沒有 private 方法和字段，繼承之后都可以重寫覆蓋
支持越界回彈（Listview、RecyclerView、ScrollView、WebView...View）

Demo

下載 APK-Demo

項目演示

風格演示

上面這兩個是我自己實現的Header，設計來自下面兩個網址：Refresh-your-delivery，Dropbox-Refresh

下面的Header是我把github上其他優秀的Header進行的整理和集合還有優化：

整理來自：TwinklingRefreshLayout，Pull Down To Refresh

整理來自：FlyRefresh，ClassicsHeader

整理來自：FunGame/BattleCity，FunGame/HitBlock

整理來自：WaveSwipeRefreshLayout，MaterialHeader

框架

如果你看完了效果圖，或許框架的意思應該有所了解了~~SmartRefreshLayout對下拉刷新功能進行系統的拆分、組合，主要由四個部分組成：

RefreshLayout下拉的基本功能，包括布局測量、滑動事件處理、參數設定等等
RefreshContent對不同內容的統一封裝，包括判斷是否可滾動、回彈判斷、智能識別
RefreshHeader下拉頭部的實現和顯示
RefreshFooter上拉底部的實現和顯示

下面是UML關系類圖

通過SmartRefreshLayout框架，你可以在一個穩定強大的下拉布局中實現自己項目需求的 Header ，不用去關心滑動事件處理，不用關心子控件的回彈和滾動邊界，只需關注自己真正的項目需求Header的樣子和動畫。

特點

這時你會問：網上其他的開源下拉控件一樣的可以自定義 Header 和 Footer ，SmartRefreshLayout 和它們比起來有什么優勢？

變換方式

Translate 平行移動特點: 最常見，HeaderView高度不會改變，
Scale 拉伸形變特點：在下拉和上彈（HeaderView高度改變）時候，會自動觸發OnDraw事件
FixedFront 固定在前面特點：不會上下移動，HeaderView高度不會改變
FixedBehind 固定在后面特點：不會上下移動，HeaderView高度不會改變（類似微信瀏覽器效果）
Screen 全屏幕特點：固定在前面，尺寸充滿整個布局

SmartRefreshLayout 的Header和Footer都有多種變換方式，適應不同風格的 Header 和 Footer，下面是不同變換方式Header的Demo

FixedBehind 固定在后面和 Scale 拉伸形變

Android開源：SmartRefreshLayout－智能下拉刷新框架

Screen 全屏幕和 Translate 平行移動

Android開源：SmartRefreshLayout－智能下拉刷新框架

整理來自：Ultra-Pull-To-Refresh，WaterDrop

??看到這么多炫酷的Header，是不是覺得很棒？這時你或許會擔心這么多的Header集成在一起，但是平時只會用到一個，是不是要引入很多無用的代碼和資源？

??請放心，我已經把刷新布局分成三個包啦，用到的時候自行引用就可以啦！

SmartRefreshLayout 刷新布局核心實現，自帶ClassicsHeader（經典）、BezierRadarHeader（貝塞爾雷達）兩個 Header.
SmartRefreshHeader 各種Header的集成，除了Layout自帶的Header，其他都在這個包中.
SmartRefreshFooter 各種Footer的集成，除了Layout自帶的Footer，其他都在這個包中.

簡單用例

1.在 buld.gradle 中添加依賴

compile 'com.scwang.smartrefresh:SmartRefreshLayout:1.0.1'
compile 'com.scwang.smartrefresh:SmartRefreshHeader:1.0.1'//如果使用了特殊的Header

2.在XML布局文件中添加 SmartRefreshLayout

<?xml version="1.0" encoding="utf-8"?>
<com.scwang.smartrefresh.layout.SmartRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/refreshLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:overScrollMode="never"
        android:background="#fff" />
</com.scwang.smartrefresh.layout.SmartRefreshLayout>

3.在 Activity 或者 Fragment 中添加代碼

RefreshLayout refreshLayout = (RefreshLayout)findViewById(R.id.refreshLayout);
refreshLayout.setOnRefreshListener(new OnRefreshListener() {
    @Override
    public void onRefresh(RefreshLayout refreshlayout) {
        refreshlayout.finishRefresh(2000);
    }
});
refreshLayout.setOnLoadmoreListener(new OnLoadmoreListener() {
    @Override
    public void onLoadmore(SmartRefreshLayout refreshlayout) {
        refreshlayout.finishLoadmore(2000);
    }
});

使用指定的 Header 和 Footer

1.方法一全局設置

//設置全局的Header構建器
SmartRefreshLayout.setDefaultRefreshHeaderCreater(new DefaultRefreshHeaderCreater() {
        @Override
        public RefreshHeader createRefreshHeader(Context context, RefreshLayout layout) {
            return new ClassicsHeader(context);//指定為經典Header，默認是 貝塞爾雷達Header
        }
    });
//設置全局的Footer構建器
SmartRefreshLayout.setDefaultRefreshFooterCreater(new DefaultRefreshFooterCreater() {
        @Override
        public RefreshFooter createRefreshFooter(Context context, RefreshLayout layout) {
            return new ClassicsFooter(context);//指定為經典Footer，默認是 BallPulseFooter
        }
    });

注意：方法一設置的Header和Footer的優先級是最低的，如果同時還使用了方法二、三，將會被其他方法取代

2.方法二 XML布局文件指定

    <com.scwang.smartrefresh.layout.SmartRefreshLayout
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/smartLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#444444"
        app:srlPrimaryColor="#444444"
        app:srlAccentColor="@android:color/white"
        app:srlEnablePreviewInEditMode="true">
        <!--srlAccentColor srlPrimaryColor 將會改變 Header 和 Footer 的主題顏色-->
        <!--srlEnablePreviewInEditMode 可以開啟和關閉預覽功能-->
        <com.scwang.smartrefresh.layout.header.ClassicsHeader
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:srlClassicsSpinnerStyle="FixedBehind"/>
        <!--FixedBehind可以讓Header固定在內容的背后，下拉的時候效果同微信瀏覽器的效果-->
        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="@dimen/padding_common"
            android:background="@android:color/white"
            android:text="@string/description_define_in_xml"/>
        <com.scwang.smartrefresh.layout.footer.ClassicsFooter
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:srlClassicsSpinnerStyle="FixedBehind"/>
        <!--FixedBehind可以讓Footer固定在內容的背后，下拉的時候效果同微信瀏覽器的效果-->
    </com.scwang.smartrefresh.layout.SmartRefreshLayout>

注意：方法二 XML設置的Header和Footer的優先級是中等的，會被方法三覆蓋。而且使用本方法的時候，Android Studio 會有預覽效果，如下圖：

不過不用擔心，只是預覽效果，運行的時候只有下拉才會出現~

3.方法三 Java代碼設置

final RefreshLayout refreshLayout = (RefreshLayout) findViewById(R.id.smartLayout);
//設置 Header 為 Material風格
refreshLayout.setRefreshHeader(new MaterialHeader(this).setShowBezierWave(true));
//設置 Footer 為 球脈沖
refreshLayout.setRefreshFooter(new BallPulseFooter(this).setSpinnerStyle(SpinnerStyle.Scale));

屬性 Attributes

名稱-name	格式-format	描述-description
srlPrimaryColor	color	主題顏色
srlAccentColor	color	強調顏色
srlReboundDuration	integer	釋放后回彈動畫時長
srlHeaderHeight	dimension	Header的標準高度
srlFooterHeight	dimension	Footer的標準高度
srlDragRate	float	顯示拖動高度/真實拖動高度（默認0.5，阻尼效果）
srlHeaderMaxDragRate	float	Header最大拖動高度/Header標準高度（默認2，要求>=1）
srlFooterMaxDragRate	float	Footer最大拖動高度/Footer標準高度（默認2，要求>=1）
srlEnableRefresh	boolean	是否開啟下拉刷新功能（默認true）
srlEnableLoadmore	boolean	是否開啟加上拉加載功能（默認true）
srlEnableHeaderTranslationContent	boolean	拖動Header的時候是否同時拖動內容（默認true）
srlEnableFooterTranslationContent	boolean	拖動Footer的時候是否同時拖動內容（默認true）
srlEnablePreviewInEditMode	boolean	是否在編輯模式時顯示預覽效果（默認true）
srlDisableContentWhenRefresh	boolean	是否在刷新的時候禁止內容的一切手勢操作（默認false）
srlDisableContentWhenLoading	boolean	是否在加載的時候禁止內容的一切手勢操作（默認false）

方法 Method

名稱-name	格式-format	描述-description
setPrimaryColors	colors	主題\強調顏色
setPrimaryColorsId	colors	主題\強調顏色資源Id
setReboundDuration	integer	釋放后回彈動畫時長
setHeaderHeight	dimension	Header的標準高度（px/dp 兩個版本）
setFooterHeight	dimension	Footer的標準高度（px/dp 兩個版本）
setDragRate	float	顯示拖動高度/真實拖動高度（默認0.5，阻尼效果）
setHeaderMaxDragRate	float	Header最大拖動高度/Header標準高度（默認2，要求>=1）
setFooterMaxDragRate	float	Footer最大拖動高度/Footer標準高度（默認2，要求>=1）
setEnableRefresh	boolean	是否開啟下拉刷新功能（默認true）
setEnableLoadmore	boolean	是否開啟加上拉加載功能（默認true）
setEnableHeaderTranslationContent	boolean	拖動Header的時候是否同時拖動內容（默認true）
setEnableFooterTranslationContent	boolean	拖動Footer的時候是否同時拖動內容（默認true）
setEnableAutoLoadmore	boolean	是否監聽列表滾動到底部時觸發加載事件
setDisableContentWhenRefresh	boolean	是否在刷新的時候禁止內容的一切手勢操作（默認false）
setDisableContentWhenLoading	boolean	是否在加載的時候禁止內容的一切手勢操作（默認false）
setReboundInterpolator	Interpolator	設置回彈動畫的插值器
setRefreshHeader	RefreshHeader	設置指定的Header
setRefreshFooter	RefreshFooter	設置指定的Footer
setOnRefreshListener	OnRefreshListener	設置刷新監聽器
setOnLoadmoreListener	OnLoadmoreListener	設置加載監聽器
setOnRefreshLoadmoreListener	OnRefreshLoadmoreListener	同時設置上面兩個監聽器
setOnMultiPurposeListener	OnMultiPurposeListener	設置多功能監聽器
setLoadmoreFinished	boolean	設置全部數據加載完成，之后不會觸發加載事件
finishRefresh	(int delayed)	完成刷新，結束刷新動畫
finishLoadmore	(int delayed)	完成加載，結束加載動畫
getRefreshHeader	RefreshHeader	獲取Header
getRefreshFooter	RefreshFooter	獲取Footer
getState	RefreshState	獲取當前狀態
isRefreshing	boolean	是否正在刷新
isLoading	boolean	是否正在加載
autoRefresh	(int delayed)	觸發自動刷新
autoLoadmore	(int delayed)	觸發自動加載

項目主頁：http://www.baiduhome.net/lib/view/home/1499311685720

本文由用戶 lillc369 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。

轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。

本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！

本文地址：http://www.baiduhome.net/lib/view/open1499311685720.html

安卓開發 Android開發移動開發

Android開源：SmartRefreshLayout－智能下拉刷新框架

Demo

項目演示

風格演示

框架

特點

簡單用例

使用指定的 Header 和 Footer

屬性 Attributes

方法 Method

相關經驗

相關資訊

相關文檔

目錄