首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 移动开发 > 移动开发 >

在 Table View 中展示一个刷新控件

2013-10-08 
在 Table View 中显示一个刷新控件 1.问题你希望在 table view 的顶部显示一个漂亮的刷新控件,让用户可以

在 Table View 中显示一个刷新控件


 1.问题


     你希望在 table view 的顶部显示一个漂亮的刷新控件,让用户可以直观的进行下拉 table
view 以进行内容的更新。刷新控件的两个不同状态如下图 所示:

在 Table View 中展示一个刷新控件

刷新控件的两个不同状态



 2。方案
创建一个 table view 控制器(4.13小节介绍过),然后将其 refreshControl属性设置为一
个新的 UIRefreshControl实例,如下代码:

-   (id)initWithStyle:(UITableViewStyle)style{ self = [super initWithStyle:style]; if  (self) { /* Create the refresh control */ self.refreshControl = [[UIRefreshControl alloc] init]; self.refreshControl = self.refreshControl; [self.refreshControl addTarget:self action:@selector (handleRefresh:) forControlEvents:UIControlEventValueChanged]; } return self; } 


 

3.  讨论
 
刷新控件是 iOS 6 SDK 中新增的一个 UI 组建。它在 table view 的顶部简单的显示一个
指示器,告诉用户,有些内容正在更新中。例如,在 iOS 6 之前的版本中,为了刷新 Mail
程序中的收件箱,你必须按一下刷新按钮。而在 iOS 6 中,现在你可以简单的向下拖动 mail
列表以进行刷新了查看新内容了。当 iOS 检测到这样的手势,会触发一个刷新事件。很酷
吧?iPhone 中的 Twitter 程序早已经添加这样的一个刷新控件了,并获得了用户的高度赞
扬!苹果也认识到以这样的方式来更新 table view 非常的棒,因此也决定在新的 SDK 中添
加这样的一个 UI组建。组建的类名叫做 UIRefreshControl。
通过调用这个类的 init 方法即可创建一个实例了。创建好之后,将这个实例添加到 table
viewl  控制器(如本节方案中所述)。
现在,你希望知道用户什么时候在 table view 中触发了一个刷新事件。为了达到这个目
的,可以调用刷新控件的 addTarget:action:forControlEvents:实例方法,并传入一个 target 对
象和一个 selector,然后将 UIControlEventValueChanged 当做 forControlEvents 参数传入。

这里——我想要向你演示这个功能。在这里的示例中,我有一个 table view 控制器,用
来显示日期和时间的格式化字符串。当用户下拉以刷新列表时,我将会把当前的日期和时间
添加到 table view 中。这样,每次用户进行下拉时,都会触发刷新事件,我们也就可以将当
前的日期和时间添加到列表中,以让 table view 显示新的日期和时间。下面我们就在我们的
table view 控制器实现文件中开始,并定义刷新控件和数据源:

#import "ViewController.h" @interface ViewController  () @property  (nonatomic, strong) NSMutableArray *times; @property  (nonatomic, strong) UIRefreshControl *refreshControl; @end @implementation ViewController  ... 

times 属性是一个简单的可变数组,它将包含所有的 NSDate 实例,以显示在 table view
中。在本节方案中的代码里面,我们可以看到table view controller 的初始化。所以这里我就
不再重复写了。不方案中的代码,我们已经设置了一个 handleRefresh:方法来响应刷新控件
的 UIControlEventValueChanged 事件。在这个方法中,我们所做的事情就是将当前日期而后
事件添加到我们的数组中,然后刷新一下table view:

-   (void) handleRefresh:(id)paramSender{ /* Put a bit of delay between when the refresh control is released and when we actually do the refreshing to make the UI look a bit smoother than just doing the update without the animation */ int64_t delayInSeconds = 1.0f; dispatch_time_t popTime = dispatch_time(DISPATCH_TIME_NOW, delayInSeconds * NSEC_PER_SEC); dispatch_after(popTime, dispatch_get_main_queue(), ^(void){ /* Add the current date to the list of dates that we have so that when the table view is refreshed, a new item will appear on the screen so that the user will see the difference between the before and the after of the refresh */ [self.times addObject:[NSDate date]]; [self.refreshControl endRefreshing]; [self.tableView reloadData]; }); } 


最后,最后,我将通过 table view 的 delegate 和数据源为其?供数据:

-   (id)initWithStyle:(UITableViewStyle)style{ self = [super initWithStyle:style]; if  (self) { self.times = [NSMutableArray arrayWithObject:[NSDate date]]; /* Create the refresh control */ self.refreshControl = [[UIRefreshControl alloc] init]; self.refreshControl = self.refreshControl; [self.refreshControl addTarget:self action:@selector (handleRefresh:) forControlEvents:UIControlEventValueChanged]; } return self; } -   (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{ return 1; } -   (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ return self.times.count; } -   (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ static NSString *CellIdentifier = @"Cell"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier]; if  (cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier]; } cell.textLabel.text = [NSString stringWithFormat:@"%@", self.times[indexPath.row]]; return cell; } 

在模拟器或者设备中运行这个程序。当程序运行时,首先你将看到在列表中只有一个跳
日期/时间数据。通过下拉 table view 来获得更多的数据(如下图)。


在 Table View 中展示一个刷新控件



    -------摘自《iOS 6 Programming Cookbook》



热点排行