iOS开发之——下拉刷新

引子

iOS开发中,下拉刷新是一个非常常见的动画。这里主要大致总结一下系统下拉刷新MJRefresh下拉刷新两种方法。

系统下拉刷新

  第三方的下拉刷新一般都会封装的比较好,使用起来非常简单方便,不过在这之前,最好还是自己搞清楚系统的下拉刷新吧,也很简单。UIRefreshControl官方文档

  系统的下拉刷新主要是针对列表视图,如果下拉控件用在其他视图控制器中,结果不可预知,官方说明:

NOTE

Because the refresh control is specifically designed for use in a table view that’s managed by a table view controller, using it in a different context can result in undefined behavior.”

UIRefreshControl的属性:

  • tintColor:指示器的颜色,注意,只是那个菊花的颜色,不牵扯文字的颜色。
  • attributedTitle:指示文字。

两个实例方法:

  • - (void)beginRefreshing:开始刷新,如果需要隔断时间自动刷新的话,定时器就需要调用这个方法。
  • - (void)endRefreshing:结束刷新。当刷新操作结束之后,调用此方法结束菊花。

还有一个BOOL变量:

  • BOOL refreshing:当前的刷新状态。

按照上述接口说明,创建刷新动作非常简单。

UIRefreshControl *refresh = [[UIRefreshControl alloc]init];
refresh.attributedTitle = [[NSAttributedString alloc]initWithString:@"下拉刷新"];
refresh.tintColor = [UIColor orangeColor];
[refresh addTarget:self action:@selector(pullToRefresh) forControlEvents:UIControlEventValueChanged];

然后在pullToRefresh方法中执行刷新操作,并更改提示文字和刷新状态即可。

iOS系统内置的下拉刷新是苹果iOS6以后才推出的一个API,主要是针对TableViewController增加了一个属性,refreshControl。系统内置的下拉刷新样式比较单一,一个菊花的形状,对外的接口可以修改菊花的颜色和显示的文字。

1. 新建一个RefreshControl的实例变量

UIRefreshControl *refresh = [[UIRefreshControl alloc]init];

2. 设置相关属性

attributedTitle:下拉时显示的文字;
tintColor:菊花的颜色;

3. 添加事件

[refresh addTarget:self
action:@selector(pullToRefresh)
forControlEvents:UIControlEventValueChanged];

然后在对应的事件中进行数据更新,同时也可以再次修改刷新时显示的文字和颜色。

4. 结束刷新

通过调用endRefreshing方法来结束刷新状态,同时也可以再次对结束刷新时显示的文字进行修改,不过一定要记得在调用完endRefreshing之后要再将文字改回来,改成和初始化时一样的下拉文字。

MJRefresh下拉刷新

首先,盗MJRefresh的原图,MJRefresh的类的继承关系为:
继承关系

默认无动图样式

1. 新建一个MJRefreshNormalHeader的实例变量

通过headerWithRefreshingBlock或者headerWithRefreshingTarget两个类方法进行创建。前者刷新的时候会回调block块,后者则直接调用相关的selector

MJRefreshNormalHeader *normalHeader = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
NSLog(@"开始刷新");
}];

2. 设置相关属性

MJRefresh的下拉属性比较丰富,详细介绍可以看源码。
lastUpdatedTimeblock类型,要显示的更新时间文字;
lastUpdatedTimeLabel:显示上次刷新时间的Label,可以设置显示或者隐藏,默认为显示;
stateLabel:显示刷新状态的Label,默认也为显示;
- (void)setTitle:(NSString *)title forState:(MJRefreshState)state:实例方法,设置不同刷新状态下的文字。

3. 刷新

见1。

4. 结束刷新

同样,控制刷新状态的方法有:

/** 开始刷新 */
- (void)beginRefreshing;
/** 结束刷新 */
- (void)endRefreshing;
/** 是否正在刷新 */
- (BOOL)isRefreshing;

动图样式

1. 新建一个MJRefreshGifHeader的实例变量

同样是通过headerWithRefreshingBlock或者headerWithRefreshingTarget两个类方法进行创建。

MJRefreshGifHeader *gifHeader = [MJRefreshGifHeader headerWithRefreshingTarget:self refreshingAction:@selector(pullToRefresh)];

2. 设置相关属性

因为是动图样式,所以多了一个设置图片的方法,第一个参数是需要动画显示的图片数组,第二个参数是刷新的状态,枚举值,分别有空闲状态、下拉状态、正在刷新状态等。
[gifHeader setImages:refreshImages forState:MJRefreshStatePulling]
其余属性见上一个2。

3. 刷新

见1。

4. 结束刷新

见上一个4。