咱们在开发过程中经常需要从网络上获取数据。这个时候为了增强用户体验。就可能有如下需求:在获取的数据的中时候显示加载中的UI(获取数据需要 一定的时间)、如果获取数据失败显示失败的UI、获取的数据为空的时候显示空数据的UI、数据成功获取到的时候才显示获取到的数据列表。总之一句话就是根据不同的状态现实不同的UI。这也是我们这篇文章的重点.接下来咱么就对这一需求做一个简单的封装。

一、效果图

在代码之前先把效果图贴出来给大伙看下.

  • 默认的数据为空,数据加载失败,数据加载中UI.

  • 自定义各个状态的UI样式(这里用了YY-SVGA动画框架 官网)

加入了下拉刷新功能

  • 同一个界面有多个地方使用

二、实现过程

状态不同显示的UI不同.所以我们先确定下我们要支持的状态有哪些,如下:

    public enum State {/*** 数据内容显示*/CONTENT,/*** 数据加载中*/ING,/*** 数据为空*/EMPTY,/*** 数据加载失败*/ERROR}

然后就是对布局进行封装了,StateLayout就是用来管理这四个状态的UI切换的.StateLayout里面肯定会有对应上面四种状态的View实例:数据获取成功对应view实例、数据为空对应view实例、数据获取失败对应view实例子、数据获取中对应view实例.StateLayout要做的事情就是根据不同的状态确定哪些view显示,哪些view不显示.这也是StateLayout里面最核心的逻辑了.代码如下:

    public void switchState(State state) {if (mState != null && mState == state) {return;}switch (state) {case CONTENT:mContentView.setVisibility(VISIBLE);mStateIngView.getView().setVisibility(GONE);mStateIngView.visible(false);mStateEmptyView.getView().setVisibility(GONE);mStateEmptyView.visible(false);mStateErrorView.getView().setVisibility(GONE);mStateErrorView.visible(false);break;case ING:mContentView.setVisibility(GONE);mStateIngView.getView().setVisibility(VISIBLE);mStateIngView.visible(true);mStateEmptyView.getView().setVisibility(GONE);mStateEmptyView.visible(false);mStateErrorView.getView().setVisibility(GONE);mStateErrorView.visible(false);break;case EMPTY:mContentView.setVisibility(GONE);mStateIngView.getView().setVisibility(GONE);mStateIngView.visible(false);mStateEmptyView.getView().setVisibility(VISIBLE);mStateEmptyView.visible(true);mStateErrorView.getView().setVisibility(GONE);mStateErrorView.visible(false);break;case ERROR:mContentView.setVisibility(GONE);mStateIngView.getView().setVisibility(GONE);mStateIngView.visible(false);mStateEmptyView.getView().setVisibility(GONE);mStateEmptyView.visible(false);mStateErrorView.getView().setVisibility(VISIBLE);mStateErrorView.visible(true);break;}mState = state;}

考虑到每种状态都可能有一些额外的需求.比如加载失败的状态可能额外需要有一个重新加载的按钮,或者自定义显示加载失败的文字.所以为了能尽量更多的去适应这样的功能需求,这里每种状态的view其实我都有写一个接口,让去各自实现.比如加载失败状态的接口:

public interface StateErrorInterface {interface OnRetryListener {void onRetry();}/*** 获取实体视图** @return 实体视图*/@NonNullView getView();/*** 设置提示信息*/void setPromptMessage(String msg);/*** 设置重试监听*/void setOnRetryListener(OnRetryListener listener);/*** View是否显示(有的时候可能会启动一些动画,可以在这里做开始停止的动作)*/void visible(boolean visible);
}

三、如何使用

状态呢,咱么是有四种.CONTENT state对应的UI是要打交道最多的,这个状态的UI咱们不做过多的控制.按照常规findViewById()找到这个状态里面的View然后使用.咱们主要是对其他三种状态做了一个简单的封装,既可以使用里面默认的状态UI也可以自定义的状态对应UI.就是要注意自定义状态UI的时候一定要实现对应的接口方法:自定义数据为空的时候的UI要实现StateEmptyInterface接口、自定义数据加载失败的时候的UI要实现StateErrorInterface接口、要实现数据加载中的时候的UI的时候要实现StateIngInterface接口.

默认的状态UI也是支持修改功能的

    /*** 设置默认的加载中的UI** @param creator  IngCreator*/public static void setDefaultIngCreator(IngCreator creator) {sIngCreator = creator;}/*** 设置默认数据为空的时候的UI** @param creator  EmptyCreator*/public static void setDefaultEmptyCreator(EmptyCreator creator) {sEmptyCreator = creator;}/*** 设置默认数据获取失败时候的UI** @param creator  ErrorCreator*/public static void setDefaultErrorCreator(ErrorCreator creator) {sErrorCreator = creator;}

关于Android状态切换Layout(数据加载中,数据加载失败,空数据)的东西就说这么多,里面更加具体的细节和使用方式可以参考DEMO下载链接.

Android状态页切换(数据加载中,数据加载失败,空数据)相关推荐

  1. 处理图片加载中与加载失败的组件

    实现思路 1.props支持传入最终要显示的图片.加载中图片.加载失败图 2.data定义两个变量,imgUrl存储当前显示的图片.error代表状态,包括0-加载中.1-加载成功.2-加载失败 3. ...

  2. 一个简单的页面加载管理类(包含加载中,加载失败,数据为空,加载成功)

    在最近公布的比赛框架中,发现了页面加载管理类,觉得挺有用的,所以做个简单的笔记. 什么是页面加载管理类呢?(大佬可直接跳过翻看实现过程) 如果能有这个问题,那么很好,哈哈哈,你和我一样,刚开始都挺疑惑 ...

  3. android本页切换子页,android ViewPager控件实现手势滑动切换页签-Fun言

    1,主布局文件 android:layout_width="match_parent" android:layout_height="match_parent" ...

  4. 打开计算机不显示硬盘一直在加载中,硬盘加载不出来怎么办 下面5个步骤帮你解决...

    1.检查电脑上的USB接口是否损坏.可以使用两个不同的移动存储介质插在同一个USB接口测试,可能是USB供电不足导致移动硬盘无法正常启动,供电不足的现象有可能一开始就存在.如果一个能识别,一个不能识别 ...

  5. linux下读取ntfs数据,在Linux中读取NTFS分区上的数据

    在Linux中读取NTFS分区上的数据 在有些情况下,系统需要访问本地NTFS分区上的数据,也可能需要访问网络上NTFS文件格式的数据.而使用mount -t挂载文件系统时,系统报告不支持NTFS错误 ...

  6. txt中的数据导入matlab中画图,excel怎样导入表格数据-如何将excel表格中大量数据导入matlab中并作图...

    Excel中如何将另一表格中的数据对应导入 1开表格,在上方功能栏点击据". 2.点入数据. 3.点击数据来源. 4择想要的导入的数据文件,就好了. 如何将TXT文档中的数据直接导入到Exc ...

  7. matlab导入数据作图,如何将excel表格中大量数据导入matlab中并作图:excel表格数据制图软件...

    是否有能替代Excel作图表的软件? 我认为数据观你可以试试,因为它提供多种可视化图表,涵盖所有excel提供的图形,您可以进行任何个性化设置. 将excel数据制作成漂亮图表的软件?做图表用什么软件 ...

  8. Android开发必会技术!Flutter中网络图片加载和缓存源码分析,完整PDF

    起因 事情是这样的. 4年前毕业那会,呆在公司的短视频项目,做 视频.那会做得比抖音还早,但是由于短视频太烧钱了,项目被公司关掉了.当时需要开发横竖屏直播/异步视频的场景,就研究下了市场上的 app, ...

  9. Mac下的Chrome浏览器系统为英文状态下切换为中文,中英切换

    打开终端(F4 > 其它 > 终端) 设置浏览器显示语言为英语: defaults write com.google.Chrome AppleLanguages '(en-US)' 切为中 ...

  10. c语言存储多个数据,C语言中如何求数组真实存有数据的元素个数

    这个是比较容易解决的,这是我把楼主的程序略加修改后的代码: # include # include # include int main() { int a[100]; int n; int i; i ...

最新文章

  1. 我发现了一个非常酷的软件,用自然语言编程!
  2. 国内首个深度学习工程师认证标准发布
  3. 牛逼!二维码会被人类扫完吗?疫情期间用掉了1400亿个!
  4. Linux 文件系统的目录结构
  5. 隐式反馈的去噪,模型取得巨大提升
  6. 操作系统原理: 计算机的体系结构、内存的层次结构 、地址的生成
  7. 理解Event的冒泡模型
  8. android 二次绘制 layout,View的三次measure,两次layout和一次draw
  9. 网络基础3-1(细谈IP协议头, 网络层,子网划分,路由选择,数据链路层,以太网帧格式,MAC地址,再谈ARP协议)
  10. x264编码参数大测试:03 subme与crf(c)
  11. 我想重构网站的前端!不,你不想....
  12. 行政管理对计算机的要求,信息技术对行政管理的影响.doc
  13. vue 手机h5动态银行支付密码键盘前端
  14. mysql 性能优化方向
  15. php控制打印机打印设置,专为控制打印设计的CSS样式
  16. 【好用的办公软件】万彩办公大师教程丨PDF安全加密解密
  17. web 服务器安全维护,Web服务器安全攻击及防护机制详解
  18. C语言scanf函数用法详细解释!!!
  19. linux篇-安装cmatrix(黑客帝国矩阵效果)
  20. 【ES系列】ES的数据结构与DSL语法

热门文章

  1. hypermesh optistruct 形状优化
  2. 软件工程概述思维导图总结(一)
  3. Spring 揭密——第 1 章 Spring 框架的由来
  4. 手把手教你使用人人开源
  5. 计算机组成原理课后答案(唐朔飞第三版) 第三章
  6. svn汉化依然失败无解
  7. MySQL数据类型详解
  8. 三菱plc编程软件怎么用c语言,各种三菱PLC编程软件的用途介绍
  9. 操作系统——零碎概念
  10. 机房服务器存放位置要求,服务器机房建设设计要求规范.doc