Monday, September 10, 2012

Kỹ thuật Pull down to Refresh

 Như các bạn đã thấy, trong rất nhiều ứng dụng, khi muốn refresh 1 UITableView, chỉ cần kéo table xuống phía dưới thì nội dung trong table tự động reload. Kỹ thuật này cũng không có gì là khó. Mình sẽ hướng dẫn các bạn cách làm:

- Đầu tiên, vào google tìm download 2 file này: EGORefreshTableHeaderView.h và EGORefreshTableHeaderView.m (tác giả Devin Doty - Copyright 2009 enormego), add vào project của bạn.

- Tại class có chứa nội dung UITableView cần reload data, giả sử có tên là NewsViewController, các bạn thêm vào như sau:

File NewsViewController.h

Mã:
@interface NewsViewController : UIViewController <EGORefreshTableHeaderDelegate> 
{
    IBOutlet UITableView *myTableView;        
    EGORefreshTableHeaderView *_refreshHeaderView;
    BOOL _reloading;
}
File NewsViewController.m :

Tại hàm viewDidLoad(), thêm đoạn này vào:
Mã:
//Add the refresh view
    if (_refreshHeaderView == nil) 
   {
  
         EGORefreshTableHeaderView *view = [[EGORefreshTableHeaderView alloc] initWithFrame:CGRectMake(0.0f, 0.0f -   self.myTableView.bounds.size.height, self.view.frame.size.width, self.myTableView.bounds.size.height)];
         view.delegate = self;
         [self.myTableView addSubview:view];
         _refreshHeaderView = view;
   }
 
   //  update the last update date
   [_refreshHeaderView refreshLastUpdatedDate];


Cài đặt các hàm delegate của EGORefreshTableHeaderDelegate như sau:
Mã:
#pragma mark -
#pragma mark Data Source Loading / Reloading Methods

- (void)reloadTableViewDataSource
{
 
 //  should be calling your tableviews data source model to reload
 _reloading = YES;
    
    //Thực hiện update lại data của table ở đây
}


- (void)doneLoadingTableViewData
{
 
 //  model should call this when its done loading
 _reloading = NO;
 [_refreshHeaderView egoRefreshScrollViewDataSourceDidFinishedLoading:myTableView];
 
}


#pragma mark -
#pragma mark UIScrollViewDelegate Methods


- (void)scrollViewDidScroll:(UIScrollView *)scrollView1{ 
 
 [_refreshHeaderView egoRefreshScrollViewDidScroll:scrollView1];
    
}


- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView1 willDecelerate:(BOOL)decelerate{
 
 [_refreshHeaderView egoRefreshScrollViewDidEndDragging:scrollView1];
 
}
#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
 
}
 
 
Thế là xong, bây giờ bạn đã sở hữu kỹ thuật Pull down to Refresh rồi đó 



No comments:

Post a Comment