正文
ios开发下拉刷新,ios下拉页面
小程序:扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序
【扫一扫了解最新限行尾号】
复制小程序
iOS 下拉刷新和上拉加载更多效果原理
下拉刷新和上拉加载更多功能是一个应用非常广泛的一个效果,而网上也提供了实现这种效果的第三方库,比如MJRefresh,用起来非常方便。那么,我们有没有想过下拉刷新和上拉加载更多的原理是什么,我们自己如何封装一个这种上下拉刷新的效果出来!
下拉刷新实际上是监测UIScrollView的contentOffset的y值,当他往下拉动时,UIScrollView的contentOffset是一直减小的,然后把通过动画把它的contentInset值控制成一个定值,然后通过设置延时来把UIScrollView的contentInset的值恢复原点。
上拉加载其实原理和下拉刷新基本是一样的,只不过判断的contentOffset的值不同,如果scrollView.bounds.size.height + scrollView.contentOffset.y scrollView.contentSize.height,说明你执行了上拉操作,然后实现起来基本就和下拉刷新是一样的。
上图所示,给tableView增加一个顶部的子视图和一个底部的子视图,只是初始的时候这些视图在手机屏幕的外面,我们看不到而已。
1、首先,我们在控制器中添加一个tableView,并在tableView的顶部和底部各添加一个子视图,作为下拉刷新view和上拉加载更多view,如上图所示。
添加tableView和子视图的步骤大家应该很熟悉,所以,略!
2、设置scrollView的代理。实现- (void)scrollViewWillBeginDecelerating:(UIScrollView*)scrollView方法。
- (void)scrollViewWillBeginDecelerating:(UIScrollView*)scrollView方法,在用户停止拖动,手指将要离开屏幕的时候调用。在该方法中判断scrollVoew的contentOffset.y值的大小,来确定用户拖动的幅度大小。
3、正在下拉刷新或者加载更多的时候,通过改变tableView的contentInset来改变内边距。(自动开始下拉刷新或自动上拉刷新,也可以调用下面这两个方法)
4、结束下拉刷新或上拉加载更多
5、效果图如下:
iOS仿微信朋友圈下拉刷新
demo链接:
喜欢的话请在github给颗小星星哦?!
先说一下用法,然后再说实现
使用方法很简单,导入头文件UIView+XDRefresh.h
用一个与下拉刷新小圆圈一样大小的scrollview,把其contentSize也置为同样大小,然后把下拉刷新的小圆圈放到scrollview上,这样在下拉刷新过程中只需要根据被观察者的下拉状态去改变这个scrollview的contentoffset.y即可实现小圆圈的上下移动,而不需要去渲染下拉小圆圈的frame
刷新过程主要分为三种状态
主要方法,通过kvo去观察tableview的下拉过程
实现观察者的代理 并在其中实现三种状态(非刷新,刷新,(全非)既不刷新也不非刷新)
全非状态时直接return 以屏蔽掉刷新、非刷新状态 (刷新小圆圈在下拉悬停状态时进入全非状态,待刷新完成后自动收回,这个过程应避免人为干预造成卡顿,而刷新、和非刷新状态人为拉动时都会干预到小圆圈的contentoffset所以要屏蔽掉)
非刷新状态逻辑
刷新状态逻辑
刷新
动画效果
动画结束后回到最初角度
结束刷新
到此基本刷新逻辑已经完成了 ,还有一些结束刷新时的操作就不在这里赘述了,demo里面有详细的解析,有什么不合理的地方还望大家指出。
demo链接:
使用方法在 该链接的ReadMe里
喜欢的话请在github给颗小星星哦?!
iOS常用刷新控件(下拉、上拉)详解
首先说一下:UIActivityIndicator作为刷新控件
主要实现方法如下:
下拉刷新01-默认
下拉刷新02-动画图片
下拉刷新03-隐藏时间
下拉刷新04-隐藏状态和时间
下拉刷新05-自定义文字
下拉刷新06-自定义刷新控件
上拉刷新01-默认
上拉刷新02-动画图片
上拉刷新03-隐藏刷新状态的文字
上拉刷新04-全部加载完毕
上拉刷新05-自定义文字
上拉刷新06-加载后隐藏
上拉刷新07-自动回弹的上拉01
上拉刷新08-自动回弹的上拉02
上拉刷新09-自定义刷新控件(自动刷新)
上拉刷新10-自定义刷新控件(自动回弹)