UITableView:下拉刷新和上拉加载更多

【转载请注明出处】

本文将说明具有多个section的UITableView在使用下拉刷新机制时会遇到的问题及其解决方案。

工程地址在帖子最下方,只需要代码的直拉到底即可。

【目录】

1、现象分析;

2、解决方案;

3、工程地址。

1、现象分析 
当前的大多数支持下拉刷新的库,都是通过修改UIScrollView的contentInset实现的。

(可参见我的这篇帖子:UITableView:下拉刷新和上拉加载更多)

使用这种方法带来的问题是,当UITableView具有多个section时,依照上述方式使用下拉刷新,在加载过程中上滑,会出现样式跑版:

为了分析出问题所在,首先在控制台打印出正常状态下UITableView的所有子View :

比较各行的frame.origin.y可以看出,UITableView的section headerView是和cell一起,按顺序放入基类UIScrollView的内容View中的。

再看加载中时的情况:

从Pull2RefreshView的frame可以看出,此时UITableView的contentInset已经被修改为(65, 0, 0, 0)。而section headerView和各个cell的frame.origin.y不受影响,和预期一致。

最后看看在加载中状态下上滑时的情况,将UITableView上滑至上方图中所示情境,即第一行的cell刚刚好越过section headerView:

可以看到,section headerView的frame.origin.y发生了变化,它和第二个cell一起被放在了第一个cell的下方,即:

section headerView.frame.origin.y == firstCell.frame.origin.y + cellHeight;

继续上滑,可以看到section headerView.frame.origin.y不断变化,但在界面显示上,始终位于距离UITableView.frame.origin.y为65(即修改后contengInset.top的值)的位置,直到下一个section headerView出现时,才随着cell向上移动,如图:

注意:不论在任何情况下,第一个cell的frame.origin.y始终为section headerView的高度,在本例中为23,即使它已经处于section headerView的上方】

2、解决方案 

由此,可以粗略得出以下结论:

A、 section headerView和cell之间并不是简单的顺序摆放的关系,它们之间可以发生重叠;

B、 section headerView在界面上的显示位置由UITableView.contentInset.top决定,直到被下一个section headerView替代。

如此,想要在滑动时修改section headerView的显示位置,令其和cell一起移动,只需要动态地修改UITableView.contentInset.top即可,如下:

 1  - (void)scrollViewDidScroll:(UIScrollView *)scrollView
 2   {
 3       //added 2013.11.28 动态修改headerView的位置
 4       if (headerRefreshing)
 5       {
 6           if (scrollView.contentOffset.y >= -scrollView.contentInset.top
 7               && scrollView.contentOffset.y < 0)
 8           {
 9               //注意:修改scrollView.contentInset时,若使当前界面显示位置发生变化,会触发scrollViewDidScroll:,从而导致死循环。
10              //因此此处scrollView.contentInset.top必须为-scrollView.contentOffset.y
11              scrollView.contentInset = UIEdgeInsetsMake(-scrollView.contentOffset.y, 0, 0, 0);
12          }
13          else if (scrollView.contentOffset.y == 0)//到0说明headerView已经在tableView最上方,不需要再修改了
14          {
15              scrollView.contentInset = UIEdgeInsetsZero;
16          }
17      }
18      
19      //other code here...
20  }

Added 2014.7.24:

对于不需要提交到AppStore的应用,还有一个更简单的办法,即覆盖UITableView的私有方法。

- (BOOL)allowsHeaderViewsToFloat
{return NO;
}- (BOOL)allowsFooterViewsToFloat
{return NO;
}

3、工程地址

使用iOS 6.1 SDK编译,使用ARC。
地址:https://github.com/cDigger/CDPullToRefreshDemo

【参考】

1、Section Headers in UITableView when inset of tableview is changed

http://stackoverflow.com/questions/5466097/section-headers-in-uitableview-when-inset-of-tableview-is-changed

2、Change Default Scrolling Behavior of UITableView Section Header

http://stackoverflow.com/questions/664781/change-default-scrolling-behavior-of-uitableview-section-header

转载于:https://www.cnblogs.com/lexingyu/p/3448532.html

下拉刷新和UITableView的section headerView冲突的原因分析与解决方案相关推荐

  1. EGOTableViewPullRefresh实现下拉刷新

    移动应用开发中有这么一种场景,就是在列表中显示的数据刷新,有点击刷新按钮刷新的,也有现在最流行的由Twitter首先推出的下拉刷新功能,在IOS中,使用下拉刷新更新UITableView中的数据也用的 ...

  2. 自定义控件:下拉刷新

    PullToRefresh 下拉刷新 上拉加载 掌握自定义的具有下拉刷新和上拉加载功能的 ListView 掌握自定义的侧边栏 SlidingMenu 在日常开发工作中,应用界面常常都是用ListVi ...

  3. 自定义listview实现下拉刷新的效果

    1.我们需要考虑的listview当前处于的几种状态 1)默认状态(DONE=3) 表示加载完成,刷新头部消失不见 2)正在刷新的状态(REFRESHING=2) 表示正在刷新的状态值 3)刚开始下拉 ...

  4. Android仿苹果版QQ下拉刷新实现(三)

    前言 第三篇下拉刷新的博客来的稍微有点晚,因为前两篇的博客访问量一直不是很高,所以博主花了点时间修改了整体的Demo效果,处理了很多极端下拉情况下的显示问题,给大家呈现一个完美的下拉刷新控件.因为本文 ...

  5. Android SwipeRefreshLayout下拉刷新控件源码简单分析

    咱们在做Android APP开发的时候经常碰到有下拉刷新和上拉加载跟多的需求,这篇文章咱们先说说下来刷新,咱们就以google的原生的下拉刷新控件SwipeRefreshLayout来看看大概的实现 ...

  6. tableview插入刷新_iOS开发之UITableView与UISearchController实现搜索及上拉加载,下拉刷新实例代码...

    废话不多说了,直接给大家贴代码了. 具体代码如下所示: #import "ViewController.h" #import "TuanGouModel.h" ...

  7. iOS UITableView下拉刷新上拉加载更多EGOTableViewPullRefresh类库使用初级剑侠篇(欢迎提建议和分享遇到的问题)

    这篇文章说下:MJRefresh和  EGOTableViewPullRefresh 的使用方法最下面有原理说明,若有不对或者建议请评论指出,先谢谢了: 首先是英文原文和类库下载地址:https:// ...

  8. IOS第四天-新浪微博 -存储优化OAuth授权账号信息,下拉刷新,字典转模型

    *************application - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOpti ...

  9. 安卓下拉刷新、上拉加载数据显示

    整个是一个scrollView,嵌套一个线性布局,下拉刷新.或者上拉加载后,通过addView()方法,加载消息体,每一个消息体是一个复杂的子view. 做一个类似qq客户端"好友动态&qu ...

最新文章

  1. 2021年大数据Flink(八):Flink入门案例
  2. 大厂项目是如何死掉的?太过真实!
  3. 2020年五大云计算预测
  4. 新版 apache_2.0.54 php-5.0.4 mysql-4.1.12a 组合安装向导(原创)
  5. react学习笔记1--基础知识
  6. 【网址收藏】如何设置node.js存储路径:node缓存、数据目录
  7. 怎么修改antd mobile中picker样式_修改 iPhone 双信号方法,超级好玩
  8. TutorialsTeacher 中文系列教程【翻译完成】
  9. 2020潮流海报设计PNG免抠素材
  10. Firefox 差点就赢了第二次浏览器大战!
  11. 动态规划-----(思路详解)
  12. Centos之故障排除
  13. 【2021最新版】Linux面试题总结(48道题含答案解析)
  14. 顺序表 数据结构 顺序表基本操作 C语言实现 顺序表详解
  15. Leetcode——第108题
  16. 1N4001-1N4007 整流二极管比较
  17. 算法套路学习笔记(第二章) 动态规划系列 2.13-2.19
  18. 鼠标悬停下划线显示特效,html鼠标悬停显示下划线
  19. 96-Java的打印流、打印流重定向、补充知识:Properties、commons-io框架
  20. 2014苹果全球开发者大会:新系统成主角 无硬件发布

热门文章

  1. java远程关机_通过jsch实现对linux服务器的shell客户端远程控制关机完整示例代码分享...
  2. mac mysql not found_mac版mysql安装后显示mysql: command not found咋整?
  3. 5.4php-fpm配置,CentOS5.4下配置Nginx0.8.33+PHP5.3+PHP-fpm+MySQL5.5
  4. 分页的limit_Presto分页功能概述
  5. c语言实验交换字母,新C语言实验学生版
  6. vue商品列表滚动效果_vue+帧动画 实现 获奖奖品列表滚动循环展示
  7. python 迭代器 生成器_python 迭代器与生成器
  8. nginx ngx_http_access_module
  9. Centos 网络配置
  10. C++语言类的多态介绍和示例