2011年8月16日 星期二

UITableView 新增下拉更新(Pull-refresh)


https://github.com/enormego/EGOTableViewPullRefresh

一、找到你的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提供的那一套圖片包拖進你的工程裡。

五、很抱歉沒有第五步了,編譯你的工程,打開simulator ,看看效果吧。包你滿意。
其實還沒完,這裡補充一點花絮。關於這個Pull & Refresh 功能的完整版來龍去脈。其實呢,最早出現這個Pull & Refresh 功能的app 是Tweetie 2 ,也就是現在大家每天都在用的Twitter for iPhone 的前身。因為這個小功能實在是很好用很貼心,所以就被Enormego 團隊發現了。但是Tweetie 2 是閉源的,於是很牛逼很強大的Enormego 就自己寫了一個,並且很大方的放到GitHub 上開源了。但是諸位如果仔細回憶一下,不難發現,真正讓這個Pull & Refresh 走紅的,是Facebook 旗下的Three20 開源框架。