现在的位置: 首页 > 综合 > 正文

EGOTableViewPullRefresh下拉原理及代码详解

2018年01月23日 ⁄ 综合 ⁄ 共 1229字 ⁄ 字号 评论关闭

在移动应用开发中,无论是Android还是IOS应用,经常可以看到下拉列表松开后自动刷行数据,在IOS中,使用下拉刷新UITableView中的数据用的非常多,最典型的就是新浪微博的客户端,使用下拉的形式来更新最新的微博信息。


首先请点击下载源码,下载完成后里面有个Demo是可以直接运行的Xcode工程,然后就是这个开源项目的源码,如何使用可以参照Demo,这个EGOTableViewPullRefresh我修改了一部分,并添加了一些注释,主要是支持了中英文版本,原生的只支持英文,我添加了中英文支持,然后就是刷新时间的格式,修改后的格式更直观,原生的是使用SDK自带的时间格式。


这时我第一次写博客,写的不好请见谅哈!


开始进入正题。。。。。

这次主要讲解EGOTableViewPullRefresh下拉的实现原理,并对EGOTableViewPullRefresh源代码进行讲解,至于如何使用EGOTableViewPullRefresh,可以参考我上传的Demo。

UITableView继承之UIScrollView,所以利用UIScrollView滚动的位置属性contentOffset,获取用户下拉的位置contentOffset.y,通过计算用户下拉了多少,来实现下拉刷新的功能。

首先看看下拉列表的组成部分,下拉列表就是UITableView了,在UITableView中添加一个子View,用来显示下拉刷新的状态,我把它叫做HeaderView,HeaderView初始化frame的位置是{0,-60,0,60},所以正常情况下我们看不到HeaderView,当用户下拉列表时HeaderView就会显示出来。第二张图的数值表示的是初始化的时候,不是下拉时的数值,为了方便看到HeaderView,便于理解,所以把列表下拉后标注数值。

UITableView在顶部时UIScrollView的contentoffset.y=0,在用户下拉滑动列表时,

contentoffset.y为负数增大,

当contentoffset.y <= -65时表示HeaderView已经完全显示出来了,此时HeaderView便显示“松开刷新”

,并把下拉的箭头图标向上。

此时若用户松开手,停止下拉,HeaderView的状态就改为等待数据的状态,如下图所示(下图的contentoffset.y=0标错了,是=-60)

以上就是顶部下拉刷新数据的原理了,根据这个原理也就不难写出底部上拉刷新数据的实现了。

下面我们来分析下EGOTableViewPullRefresh的代码。

EGOTableViewPullRefresh的代码结构

EGORefreshTableHeaderView.h的代码

EGORefreshTableHeaderView.m的代码

这是我发的处女文章,写的不好请见谅哈,如果觉得还可以,就转载下哈。

http://blog.csdn.net/kqjob

抱歉!评论已关闭.