咱们在开发过程中经常需要从网络上获取数据。这个时候为了增强用户体验。就可能有如下需求:在获取的数据的中时候显示加载中的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. canvas之二:绘制三角形
  2. 自定义控件:侧滑面板
  3. python颜色库_Python可视化_matplotlib08-palettable颜色库(四)
  4. NYOJ 252 01串 dp
  5. C0302 将一个代码块中的内容保存在文件中, 查看一个rpm包是否可以安装
  6. Faste R-CNN的安装及测试
  7. RESTful 架构
  8. led透明屏生产厂家_LED透明屏厂家哪家好?2020年中国深圳LED透明屏品牌排行榜...
  9. Pycharm中创建一个 Python 项目
  10. Linux centos7系统下JBoss7.1的部署安装
  11. 内存映射文件原理(转载)
  12. cpu空载50度_让电脑拥有一个“冷静”空间:九州风神玄冰50+堡垒240水冷套
  13. 驱动学习(十)poll机制
  14. 荣耀8_解锁_刷入第三方Recovery_root_刷入面具_刷机教程
  15. 6-1 jmu-python-组合数据类型-1.计算坐标点欧氏距离 (10 分)
  16. 国外LEAD第一笔收款你还记得吗
  17. ReactiveUI 入门
  18. 概率初步(1 Juin, 2019)
  19. Connect to maven.google.com:443 [maven.google.com] failed: Connection timed out: connect 解决办法
  20. MT7601 无线wifi网卡驱动移植

热门文章

  1. 文件夹同步/备份软件推荐 (SyncToy/FreeFileSync/Compare Advance/Good Sync/Allway Sync)
  2. 漏洞扫描工具MySQL_打造一款自动扫描全网漏洞的扫描器
  3. 基于大数据的城市租房信息可视化分析系统
  4. python flask文件下载 | 实用代码架构
  5. NEFUCTF校赛-题解
  6. Python游戏编程入门-打飞机
  7. 多家多平台拿走的AD封装库Altium-3D封装库+超全原理图库含51+STM32库
  8. 【iOS源码】懒人笔记应用源码
  9. 10W+字C语言从入门到精通保姆级教程(2021版下)
  10. matlab数字信号处理与应用 张德丰,MATLAB数字信号处理与应用