IOS开发系列之阿堂教程:tableView的下拉涮新功能实践

IOS开发系列之阿堂教程:tableView的下拉涮新功能实践

2012-3-20 12:19|发布者:
benben|查看: 697|评论: 0

摘要: 说到下拉涮新，如果用过apple的iphone/ipad/itouch等产品的朋友们一定不会陌生。对下面的图示，一定会很有印象的。这种涮新效果的确很不错。。当然，网络时空(阿堂)也在自己的IOS应用开发中用到了此效果！如下图所示 ...

说到下拉涮新，如果用过apple的iphone/ipad/itouch等产品的朋友们一定不会陌生。对下面的图示，一定会很有印象的。



这种涮新效果的确很不错。。当然，网络时空(阿堂)也在自己的IOS应用开发中用到了此效果！如下图所示



有的朋友会说，我也要给我的app里的所有table view都添加这个 pull & refresh 的功能，于是从apple的官方文档或api文档中去找查找，不过，令人失望的是，apple并没有提供此功能。这是由Enormego 团队，一个来自美国的天才、热心的开发团队提供的开源库。。需要我们集成到自己的ios应用中去才行.

下面就让我们来看看具体步骤.
一、找到你的 UITableView / UITableViewController 的 .h 文件，结合以下代码，添加相应的元素：
#import "EGORefreshTableHeaderView.h"
@interface RootViewController : UITableViewController {
EGORefreshTableHeaderView *_refreshHeaderView;
// Reloading var should really be your tableviews datasource

// Putting it here for demo purposes

BOOL _reloading;

}
-(void)reloadTableViewDataSource;

-(void)doneLoadingTableViewData;

@end

二、切换到你的 UITableView / UITableViewController 的 .m 文件，结合以下代码，添加相应的元素：

-(void)viewDidLoad {

[super viewDidLoad];
if(_refreshHeaderView ==nil){
EGORefreshTableHeaderView *view =[[EGORefreshTableHeaderView alloc] initWithFrame:CGRectMake(0.0f, 0.0f - self.tableView.bounds.size.height, self.view.frame.size.width, self.tableView.bounds.size.height)];

view.delegate = self;

[self.tableView addSubview:view];

_refreshHeaderView = view;

[view release];
}
// update the last update date

[_refreshHeaderView refreshLastUpdatedDate];

}

#pragma mark -

#pragma mark Data Source Loading / Reloading Methods
-(void)reloadTableViewDataSource{
// should be calling your tableviews data source model to reload

// put here just for demo

_reloading =YES;
}
-(void)doneLoadingTableViewData{
// model should call this when its done loading

_reloading =NO;

[_refreshHeaderView egoRefreshScrollViewDataSourceDidFinishedLoading:self.tableView];
}

#pragma mark -

#pragma mark UIScrollViewDelegate Methods
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
[_refreshHeaderView egoRefreshScrollViewDidScroll:scrollView];
}
-(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{
[_refreshHeaderView egoRefreshScrollViewDidEndDragging:scrollView];
}

#pragma mark -

#pragma mark EGORefreshTableHeaderDelegate Methods
-(void)egoRefreshTableHeaderDidTriggerRefresh:(EGORefreshTableHeaderView*)view{
[self reloadTableViewDataSource];

[self performSelector:@selector(doneLoadingTableViewData) withObject:nil afterDelay:3.0];
}
-(BOOL)egoRefreshTableHeaderDataSourceIsLoading:(EGORefreshTableHeaderView*)view{
return _reloading; // should return if data source model is reloading
}
-(NSDate*)egoRefreshTableHeaderDataSourceLastUpdated:(EGORefreshTableHeaderView*)view{
return[NSDate date]; // should return date data source was last changed
}

三、最后呢，为了彰显你良好的内存管理习惯，别忘了释放掉相应的 UI 元素：
-(void)viewDidUnload {

_refreshHeaderView=nil;

}
-(void)dealloc {
_refreshHeaderView =nil;

[super dealloc];

}

四、编译之前，别忘了将EGORefreshTableHeaderView.h、EGORefreshTableHeaderView.m两个文件，以及Enormego提供的那一套图片包拖进你的工程里。
五、很抱歉没有第五步了，编译你的工程，打开 simulato,一切都ok了

至此你就应该可以看到类似 于 网络时空(阿堂)上面的实现效果了。。实际上，阿堂上面的图中，由于还有“所有”,"成功","失败"个标签的切换时，都有下拉涮新效果，每种情况的下拉涮新的上次涮新日期都是各不相同的，很显然还要在上面的demo中进行改写EGORefreshTableHeaderView.h、EGORefreshTableHeaderView.m还需要改写源库才行，这是后话了，阿堂不想将业务说得太复杂了。。网友朋友们只需要知道上面的steps可以实现简单的下拉涮新的效果就行
这里阿堂今天写这遍文章的主要目的，其实并不只是想说明实现下拉涮新效果的一般 steps,而是想说明在实际应用中，当和web server服务端要实际数据交互时，需要变更的地方，才是本遍文章的主要目的了！
请我们来一起关注如下这个方法。
-(void)egoRefreshTableHeaderDidTriggerRefresh:(EGORefreshTableHeaderView*)view{
[self reloadTableViewDataSource];

[self performSelector:@selector(doneLoadingTableViewData) withObject:nil afterDelay:3.0];
}

其实，我们在和服务端交互时，就需要在上述这个代理方法中，分别调用 reloadTableViewDataSource方法,和过3秒后再调用doneLoadingTableViewData 方法，前一个方法是表示和服务端要进行交互了，此时_reloading=YES,然后过3秒后，我们实际上是假设这时候服务端已经正常将数据发送到iphone客户端来了，结束涮新效果显示了。
事实上，我们实际上收到服务端正常发送完数据到iphone客户端，到底是3秒，还是几秒，我们是并不能确定的。我们只能实际的逻辑进行判断才行的。。所以此处，代码在实际情况中是需要一定要修改的了。。

阿堂实际项目中是由于使用 ASIHTTPRequest第三方通讯库和web server来进行交互的。。
所以上述代理方法，最终要改为如下逻辑才行
-(void)egoRefreshTableHeaderDidTriggerRefresh:(EGORefreshTableHeaderView*)view{
[self reloadTableViewDataSource];

//发送异步请求的代码
}

在reqeustFinished方法中
- (void)requestFinished:(ASIHTTPRequest *)request{

_reloading= NO;

doneLoadingTableViewData;
}

至此，下拉涮新功能就和实际项目中的 ASIHTTPRequest的功能真正意义上关联上了，这也就是阿堂今天真正写这遍文章的目的所在了! http://www.189works.com/article-48122-1.html