声明:本篇文章的目的是让大家可以自己动手实现一个组件，本人写的这个加载页面组件也特意起名叫EasyLoading,所以不会考虑各种情况。因为不同的APP有各种不同的风格，界面布局也五花八门，所以还是自己手动撸一个组件吧。
非入侵式组件
非入侵式组件是什么意思呢？简单的说就是动态加载由代码编译生成的组件。如果是把组件写在xml布局文件中的话就可以说是入侵式组件，因为它入侵了我们原来的布局。哥的理解就是那么粗暴!
使用背景
每当跳转到一个新的页面的时候往往会请求数据接口，很多时候我们的页面需要通过请求得到的数据来填充。在拿到数据前页面就会有个尴尬期，这时就需要用一个组件把页面的内容区域遮盖住，根据各种情况给用户一个反馈。这就是加载页面的作用。
优雅的使用加载页面
我觉得每一个移动端的程序员都会做过这件事，就是写一个xml加载布局，通过<include>标签使用加载布局把内容区域遮盖，数据加载成功的时候就把加载布局隐藏，失败后就通过代码修改加载布局里面控件的属性来提示用户。每写一个页面就重复一次这样的工作，等到不胜其烦的时候就要思考怎么偷懒了。比较优雅的方式就是通过代码动态生成一个加载页面组件，在需要用到的页面把它添加到我们的根布局中，然后根据加载中、加载成功、加载失败、数据为空的情况调用组件里对应的方法，这是面向对象的基本思想。说了那么多，上效果图：
GIF.gif
再看看我们布局文件的xml代码
layout.png
这样就可以很容易的理解什么是非入侵式组件了，新增的加载布局对我们原来的布局代码完全没有影响。
组件剖析
先来看一下超级简单的结构
结构.png
EasyLoading类，主要的作用是实例化一个加载布局，然后将加载布局添加到页面的根布局中，整个类不到100行代码
EasyLoading.png
EasyLoadingView类，这是个抽象的View类，整个类不到50行代码。抽象了加载布局的主要实现方法，同学们可以通过实现这个类来自定义一个加载布局（可以参照LoadingView）然后在EasyLoading类中替换原来的加载布局。本人的目的就是鼓励大家自己动手去写一个和自己项目或自己的习惯高度契合的组件。懒的同学直接用应该问题也不大，替换一下图片就可以了，加载中的图片还是建议使用动图，这里我使用了帧动画实现。
EasyLoadingView.png
LoadingView类是EasyLoadingView的实现类200行不到的代码量，主要通过代码生成了加载中提示图片、提示文字、重载按钮，就不贴代码了。
EasyReloadInterface类一个简单的回调接口，用于响应重新加载按钮点击事件
interface.png
可以看到代码量是极少了，因为本人是个密集恐惧症患者，看到密密麻麻的代码就头皮发麻，所以尽量写得简单，代码简单了也相信大家都能看得懂。再次强烈建议自己动手撸一个组件，养成一个好习惯，把需要重复工作的环节逐个消灭，专注业务，避免做重复工作。
网友评论