直接拿去用！每個App都會用到的LoadingLayout

Weavey發表於2016-11-28
原文網址 : https://juejin.im/post/583c242061ff4b006b59c7fb
APP

前言

專案裡都會遇到幾種頁面，分別為載入中、無網路、無資料、出錯四種情況，經常要使用，所以封成庫引用了，方便使用，順便分享出來。先看一下效果：

直接拿去用！每個App都會用到的LoadingLayout

原理比較簡單，繼承FrameLayout，在xml渲染完成後，加上載入中、無網路、無資料、出錯四個頁面，根據需要控制顯示哪一層，花了些時間，開了很多方法出來，支援很多屬性的設定，算是比較實用，原始碼裡已對各個方法的作用都加了註釋，就不做過多解釋了，專案GitHub地址：github.com/weavey/Load…，感興趣的可以看看，歡迎指出問題。

使用方式

gradle引用：

compile 'com.lai.weavey:loadinglayout:1.3.1'

使用說明

LoadingLayout支援全域性配置，對所有使用到的地方都起效，需要在Application中配置，如下：

 public class App extends Application {

    @Override
    public void onCreate() {
        super.onCreate();

        LoadingLayout.getConfig()
                .setErrorText("出錯啦~請稍後重試！")
                .setEmptyText("抱歉，暫無資料")
                .setNoNetworkText("無網路連線，請檢查您的網路···")
                .setErrorImage(R.mipmap.define_error)
                .setEmptyImage(R.mipmap.define_empty)
                .setNoNetworkImage(R.mipmap.define_nonetwork)
                .setAllTipTextColor(R.color.gray)
                .setAllTipTextSize(14)
                .setReloadButtonText("點我重試哦")
                .setReloadButtonTextSize(14)
                .setReloadButtonTextColor(R.color.gray)
                .setReloadButtonWidthAndHeight(150,40);
    }
}複製程式碼

由於“載入中”的頁面，可能每個App都不一樣，因此，LoadingLayout支援自定義LoadingPage，如下：

 LoadingLayout.getConfig()
     .setLoadingPageLayout(R.layout.define_loading_page);複製程式碼

同時，為了適應個別介面的“特殊需求”，LoadingLayout也支援區域性設定各種屬性，僅對當前物件生效，不影響全域性。如下：

        LoadingLayout  loading = (LoadingLayout) findViewById(R.id.loading_layout);
        loading.setLoadingPage(R.layout.define_loading_page)
                .setEmptyText("暫無報告資料")
                .setErrorText("")
                .setNoNetworkText("")
                .setErrorImage(R.mipmap.ic_launcher)
                .setErrorTextSize(16)
                .setReloadButtonText("點我重新載入哦"); //等等複製程式碼

為ReloadButton設定監聽:

loadingLayout.setOnReloadListener(new LoadingLayout.OnReloadListener() {
            @Override
            public void onReload(View v) {

            }
        });複製程式碼

設定顯示的頁面：

 loadingLayout.setStatus(LoadingLayout.Loading);//載入中
 loadingLayout.setStatus(LoadingLayout.Empty);//無資料
 loadingLayout.setStatus(LoadingLayout.Error);//錯誤
 loadingLayout.setStatus(LoadingLayout.No_Network);//無網路
 loadingLayout.setStatus(LoadingLayout.Success);//載入成功複製程式碼

最後，在xml裡面使用：

<com.weavey.loading.lib.LoadingLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    app:isFirstVisible="true">

    <TextView
        android:background="@color/colorPrimary"
        android:visibility="visible"
        android:gravity="center"
        android:textColor="@android:color/white"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="ContentView"/>

</com.weavey.loading.lib.LoadingLayout>複製程式碼

注意：
（1）isFirstVisible屬性用來控制contentView一開始是否隱藏，由於LoadingLayout原理是在xml渲染完成後在contentView上鋪上三層View，因此，一開始如果不隱藏，等contentView渲染完成後呼叫: loadingLayout.setStatus(LoadingLayout.Loading);
會造成介面閃爍的效果，影響體驗，因此預設將contentView隱藏，所以資料載入完成後一定要呼叫loadingLayout.setStatus(LoadingLayout.Success);，將contentView顯示出來。這樣也能解決未獲取到資料的情況下，被使用者看到雜亂無章的佈局，個人還是比較喜歡預設隱藏contentView；
（2）為了方便管理，LoadingLayout只能有一個直屬子View，類似ScrollView，新增兩個直屬子View會丟擲異常throw new IllegalStateException("LoadingLayout can host only one direct child");；
（3）由於AS會直接將自定義View的特性反應在預覽介面，所以在使用LoadingLayout的時候，會無法看到被LoadingLayout包裹住的佈局（預設為gone），因此也可以將isFirstVisible屬性暫時設為true，預覽佈局。

更多精彩文章請關注微信公眾號"Android經驗分享"：這裡將長期為您分享Android高手經驗、中外開源專案、原始碼解析、框架設計和Android好文推薦！QQ交流群：Android經驗分享一區 386067289

直接拿去用！每個App都會用到的LoadingLayout
微信公眾號

相關文章