1. 前言
项目中,使用 MJRefresh 作为下拉刷新控件。在手动触发下拉刷新时候遇到了一个 bug,看了一下 MJRefresh 的源码,发现 MJRefresh 的实现不太健壮。
2. 问题描述
如果我们这样使用MJRefresh,最后MJRefresh Header将会保持下拉刷新的状态,而不能恢复到Idle的状态。
MJRefreshNormalHeader *header = [MJRefreshNormalHeader headerWithRefreshingBlock:^{
@strongify(self);
[[self.viewModel reloadData] subscribeNext:^(id x) {
@strongify(self);
[self endRefreshing];
} error:^(NSError *error) {
@strongify(self);
[self endRefreshing];
}];
}];
self.tableView.mj_header = header;
...
[self.tableView.mj_header endRefreshing];
[self.tableView.mj_header beginRefreshing];
以上代码中调用beginRefreshing
是为了触发下拉刷新。调用endRefreshing
是项目业务需要,两条语句连续执行会导致 MJRefresh 表现不正确(即不能恢复到Idle状态)。下面具体分析一下。
3.问题原因
问题核心原因是:在 MJRefreshHeader 类 setState 方法中“更改UI为 refreshing 状态”的操作是异步的。也就是说,设置 Refreshing 状态时,设置内部状态和设置UI状态被分离开了,如果在中间插入了设置内部状态(比如 Idle )的操作可能会导致内部状态和UI状态不一致的问题。另外,MJRefreshendRefreshing
方法中“设置状态为 Idle ”操作是异步的。
出现问题的原因就是两次异步,由于执行顺序的原因,导致内部状态和UI状态不一致。
源码如下:
- (void)beginRefreshing
{
...
self.state = MJRefreshStateRefreshing;
...
}
---
- (void)endRefreshing
{
dispatch_async(dispatch_get_main_queue(), ^{
self.state = MJRefreshStateIdle;
});
}
- (void)setState:(MJRefreshState)state
{
// 根据状态做事情
if (state == MJRefreshStateIdle) {
...
// 恢复inset和offset
[UIView animateWithDuration:MJRefreshSlowAnimationDuration animations:^{
self.scrollView.mj_insetT += self.insetTDelta;
// 自动调整透明度
if (self.isAutomaticallyChangeAlpha) self.alpha = 0.0;
} completion:^(BOOL finished) {
self.pullingPercent = 0.0;
if (self.endRefreshingCompletionBlock) {
self.endRefreshingCompletionBlock();
}
}];
} else if (state == MJRefreshStateRefreshing) {
dispatch_async(dispatch_get_main_queue(), ^{
[UIView animateWithDuration:MJRefreshFastAnimationDuration animations:^{
CGFloat top = self.scrollViewOriginalInset.top + self.mj_h;
// 增加滚动区域top
self.scrollView.mj_insetT = top;
// 设置滚动位置
[self.scrollView setContentOffset:CGPointMake(0, -top) animated:NO];
} completion:^(BOOL finished) {
[self executeRefreshingCallback];
}];
});
}
}
按照我们在问题描述中的调用方式,最后执行顺序如下:
- 将
设标志为 Idle 操作
入主线程队列 - 同步执行
设标志为 Refreshing
,将设 UI 为 Refreshing 样式
操作入主线程队列 - 主线程队列中的操作开始执行,执行
设标志为 Idle 操作
,同时执行将 UI 设为 Idle 样式
- 主线程继续执行队列中的操作,
设 UI 为 Refreshing 样式
至此,内部状态为idle,UI状态为refreshing。 内部状态为Idle状态,之后的endRefreshing
将不会生效(发现newState与oldState一致就直接返回了),UI无法恢复为Idle状态。
4. 问题解决
最好的解决办法是把setState中“更改UI为refreshing状态”的操作变成同步的。避免设置内部状态和设置UI状态的分离,因为两者分离之后,如果中间执行了“设置状态为Idle”,那么将导致最终内部状态为Idle、UI状态为Refreshing的问题,也就是标题所说的内部状态和UI状态不一致的问题。