前言

项目里都会遇到几种页面,分别为加载中、无网络、无数据、出错四种情况,经常要使用,所以封成库引用了,方便使用,顺便分享出来。先看一下效果:

原理比较简单,继承FrameLayout,在xml渲染完成后,加上加载中、无网络、无数据、出错四个页面,根据需要控制显示哪一层,花了些时间,开了很多方法出来,支持很多属性的设置,算是比较实用,源码里已对各个方法的作用都加了注释,就不做过多解释了,项目GitHub地址:https://github.com/weavey/LoadingLayoutDemo,感兴趣的可以看看,欢迎指出问题。

使用方式

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,预览布局。

直接拿去用!每个App都会用到的LoadingLayout的更多相关文章

  1. 项目- Vue全家桶实战去哪网App

    最近在学习Vue,花了几天时间跟着做了这个项目,算是对学习Vue入门的一个总结,欢迎同学们star 去哪网APP

  2. Vue2.5 开发去哪儿网App

    Vue2.5开发去哪儿网App 技术栈和主要框架

  3. Vue2.5开发去哪儿网App 首页开发

    主页划 5 个组件,即 header  icon  swiper recommend weekend 一. header区域开发 1. 安装 stylus npm install stylus --s ...

  4. Vue2.5开发去哪儿网App 第三章笔记 上

    1.  vue 生命周期函数 每个 Vue 实例在被创建之前都要经过一系列的初始化过程.例如,实例需要配置数据观测(data observer).编译模版.挂载实例到 DOM ,然后在数据变化时更新 ...

  5. Vue2.5开发去哪儿网App 城市列表开发之 Vuex实现数据共享及高级使用

    一,数据共享 1.  安装: npm install vuex --save 2. 在src目录下 新建state文件夹,新建index.js文件 3. 创建一个 store import Vue f ...

  6. Vue2.5开发去哪儿网App 第五章笔记 下

    1. 多个元素或组件的过渡 多个元素的过渡: <style> .v-enter,.v-leace-to{ opacity: 0; } .v-enter-active,.v-leave-ac ...

  7. Vue2.5开发去哪儿网App 第五章笔记 上

    1.css动画原理 .fade-enter{ opacity: 0; } .fade-enter-active{ transition: opacity 2s; } .fade-leave-to{ o ...

  8. Vue2.5开发去哪儿网App 第四章笔记 下

    1.解决非父子组件之间的传值问题 非父子组件传值(Bus/总线/发布订阅模式/观察者模式) 给 Vue类上挂在一个属性,然后创建vue实例时,实例就拥有了这个属性 Vue.prototype.bus ...

  9. Vue2.5开发去哪儿网App 第四章笔记 上

    一 .  组件细节知识点 1.  解决组件在h5中编码规范 例如 : table , ul , ol  等等 <table> <tbody> <row></r ...

随机推荐

  1. 【xsy2111】 【CODECHEF】Chef and Churus 分块+树状数组

    题目大意:给你一个长度为$n$的数列$a_i$,定义$f_i=\sum_{j=l_i}^{r_i} num_j$. 有$m$个操作: 操作1:询问一个区间$l,r$请你求出$\sum_{i=l}^{r ...

  2. jq02--基础函数

    jq是一个js函数库,主要是为事件处理特别设计的,现在我们继续学习一些jq函数. 1.jq效果: 显示与隐藏: $().hide(speed,callback) speed--"slow&q ...

  3. Linux实用指令

    Linux实用指令 Rpm&Yum ​ 一种用于互联网下载包的打包和安装工具,它包含某些Linux分发版中,它生产具有 .rpm 扩展名的文件.RPM 是 RedHat Package Man ...

  4. EF基础知识小记六(使用Code First建模自引用关系,常用于系统菜单、文件目录等有层级之分的实体)

    日常开发中,经常会碰到一些自引用的实体,比如系统菜单.目录实体,这类实体往往自己引用自己,所以我们必须学会使用Code First来建立这一类的模型. 以下是自引用表的数据库关系图: ok,下面开始介 ...

  5. 关于Oracle中的字符的比较

    1.Oracle比较字符串是根据ASCII码来的,第一个字母的ASCII大小比较如果相等再比较下一个: 函数来说明: CREATE OR REPLACE FUNCTION MinOrMax(para1 ...

  6. Disconf 学习系列之全网最详细的最新稳定Disconf 搭建部署(基于Ubuntu14.04 / 16.04)(图文详解)

    不多说直接上干货! https://www.cnblogs.com/wuxiaofeng/p/6882596.html (ubuntu16.04) https://www.cnblogs.com/he ...

  7. Python -- 数据结构实现

    1.堆栈(pyStack.py) class PyStack: def __init__(self, size=20): self.stack = [] self.size = size self.t ...

  8. C语言初学

    输出控制符 输出控制符 含义 %d int 整型数 %ld long int %c char 一个字符 %f float 浮点数,整数/整数=整数,整数/小数=小数 %lf double %x %X ...

  9. Go语言学习笔记十: 结构体

    Go语言学习笔记十: 结构体 Go语言的结构体语法和C语言类似.而结构体这个概念就类似高级语言Java中的类. 结构体定义 结构体有两个关键字type和struct,中间夹着一个结构体名称.大括号里面 ...

  10. Hive和SparkSQL: 基于 Hadoop 的数据仓库工具

    Hive: 基于 Hadoop 的数据仓库工具 前言 Hive 是基于 Hadoop 的一个数据仓库工具,可以将结构化的数据文件映射为一张数据库表,并提供完整的 SQL 查询功能,将类 SQL 语句转 ...