上拉刷新下拉加载

来源:互联网 发布:中国广电云计算大会 编辑:程序博客网 时间:2024/04/28 15:00

在一个项目开发过程中为了更好的体验经常会用到下拉刷新更新数据,当然也伴随一些上拉加载更多数据的情况;当前比较火的EGOTableViewPullRefresh只实现了下拉功能,而没有上拉的功能。这里介绍一个同时集成下拉刷新和上拉加载更多的类库EGOTableViewPullRefresh

英文原文和类库下载地址:https://github.com/emreberge/EGOTableViewPullRefresh    


附带 Demo效果

  


Whats different on this fork:

  • 容易集成,使用interface builder 添加tableView进行配置。
  • 配置简单, 箭头头像,背景颜色和文本颜色都能通过PullTableView类的属性很容易的更改。  
  • 上拉加载更多数据功能在Table的底部。
  • 可以通过代码修改刷新和加载更多动画。

The fast setup:

  • 添加 QuartzCore.framework 到你的工程中。
  • 将 EGOTableViewPullRefresh 拖到你的工程目录下。
  • 查看 PullTableView.h 文件可用的属性。
  • 添加一个PullTableView 到你代码中,实现PullTableViewDelegate委托方法。
  • 欣赏吧。

The detailed setup (Walk through for creating the demo project):

  • 创建一个新的xcode工程
  • 选择 View Based Application 模板(xcode 4.2以后版本是 Single View Application模板)
  • 工程名字 EGOTableViewPullRefreshDemo
  • 在工程文件下创建EGOTableViewPullRefreshDemoViewController控制器类(Single View Application模板不需这步)
  • 添加 QuartzCore.framework 到工程中

添加 PullTableView 到工程里:

  • 拖拽 EGOTableViewPullRefresh 目录下文件到工程支持的文件组下,确保(EGOTableViewPullRefresh)下文件都拷贝到目标文件组下。 

添加 PullTable 视图到 EGOTableViewPullRefreshDemoViewController.xib上:

  • 拖一个UITableView控件到View视图上.
  • 打开 Identity inspector 将Table 的继承类由  UITableView 改成PullTableView
  • 连接 dataSources数据源和 pullDelegate协议到PullTableView的 File's owner上

配置视图控制器的头文件 EGOTableViewPullRefreshDemoViewController.h:

  • 添加 #import "PullTableView.h"
  • 声明 PullTableViewDelegate 和 UITableViewDataSource协议
  • 创建一个属性名为pullTableView的输出口连接到interface Builder上的tableView上

配置视图控制器和页脚 EGOTableViewPullRefreshDemoViewController.m

  • 在.m文件中添加下面代码

[cpp] view plaincopy
  1. #pragma mark - Refresh and load more methods  
  2.   
  3. - (void) refreshTable  
  4. {  
  5.     /* 
  6.  
  7.          Code to actually refresh goes here.  刷新代码放在这 
  8.  
  9.      */  
  10.     self.pullTableView.pullLastRefreshDate = [NSDate date];  
  11.     self.pullTableView.pullTableIsRefreshing = NO;  
  12. }  
  13.   
  14. - (void) loadMoreDataToTable  
  15. {  
  16.     /* 
  17.  
  18.      Code to actually load more data goes here.  加载更多实现代码放在在这 
  19.  
  20.      */  
  21.     self.pullTableView.pullTableIsLoadingMore = NO;  
  22. }  
  23.   
  24. #pragma mark - UITableViewDataSource  
  25.   
  26. - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView  
  27. {  
  28.     return 5;  
  29. }  
  30.   
  31. - (NSInteger) tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section  
  32. {  
  33.     return 10;  
  34. }  
  35.   
  36. - (UITableViewCell *) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath  
  37. {  
  38.     static NSString *cellIdentifier = @"Cell";  
  39.   
  40.     UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier];  
  41.   
  42.     if(!cell) {  
  43.         cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];  
  44.     }  
  45.     cell.textLabel.text = [NSString stringWithFormat:@"Row %i", indexPath.row];  
  46.   
  47.     return cell;  
  48. }  
  49.   
  50. - (NSString *) tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section  
  51. {  
  52.     return [NSString stringWithFormat:@"Section %i begins here!", section];  
  53. }  
  54.   
  55. - (NSString *) tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section  
  56. {  
  57.     return [NSString stringWithFormat:@"Section %i ends here!", section];  
  58. }  
  59.   
  60. #pragma mark - PullTableViewDelegate  
  61.   
  62. - (void)pullTableViewDidTriggerRefresh:(PullTableView *)pullTableView  
  63. {  
  64.   
  65.     [self performSelector:@selector(refreshTable) withObject:nil afterDelay:3.0f];  
  66. }  
  67.   
  68. - (void)pullTableViewDidTriggerLoadMore:(PullTableView *)pullTableView  
  69. {  
  70.     [self performSelector:@selector(loadMoreDataToTable) withObject:nil afterDelay:3.0f];  
  71. }  

  • 对于UI的配置,在ViewDidLoad()方法里面添加下面代码(比如 修改刷新和上拉的背景色箭头头像等)
[cpp] view plaincopy
  1. self.pullTableView.pullArrowImage = [UIImage imageNamed:@"blackArrow"];  
  2. self.pullTableView.pullBackgroundColor = [UIColor yellowColor];  
  3. self.pullTableView.pullTextColor = [UIColor blackColor];  

  • 对于手动设置动画可使用 pullTableIsRefreshing 和pullTableIsLoadingMore 属性. 比如在 viewWillAppear:方法里面添加下面的代码

[cpp] view plaincopy
  1. if(!self.pullTableView.pullTableIsRefreshing) {  
  2.     self.pullTableView.pullTableIsRefreshing = YES;  
  3.     [self performSelector:@selector(refreshTable) withObject:nil afterDelay:3]

0 0
原创粉丝点击