Pull to refresh UITableView

Those of us using iPhones and who are on iOS 6.x have seen Apple’s implementation of pull to refresh. Apple has made this control available to iOS developers – starting with iOS 6.0. We’ve all seen various implementations by other developers that fit their design paradigm, but I think Apple’s implementation is quite nice and could potentially fit many designs. If you’d like to implement this control read on. A current caveat is that this control works with UITableView only at the moment.

It’s called the UIRefreshControl. To use it there are a few things you need to implement. You have limited control over how things are displayed, you’ll see that in a moment.

• There needs to be a defined callback method that will refresh your table content.
• You need to create the control.
• When the valueChange event is fired you need to call that callback method.
• Add the control to your UITableViewController’s refreshControl property.

Code your callback method… this will be called when a user pulls down far enough on your UITableView. It takes a single parameter – a pointer to the UIRefreshControl.

- (void)refreshMyTable:(UIRefreshControl *)refreshControl {
    refreshControl.attributedTitle = [[NSAttributedString alloc] initWithString:@"Updating..."];
    //refresh your data here
    NSDateFormatter *formatter = [[NSDateFormatter alloc] init];
    [formatter setDateFormat:@"MMM d, h:mm a"];
    NSString *updated = [NSString stringWithFormat:@"Last update: %@", [formatter stringFromDate:[NSDate date]]];
    refreshControl.attributedTitle = [[NSAttributedString alloc] initWithString:updated];
    [refreshControl endRefreshing];
}

It’s odd but also flexible that you cannot use a regular NSString to display beneath the icon in the control. You need to use an attributed string. The endRefreshing call stops and hides the refresh icon – and scrolls the table back up into position. There is also a method called beginRefreshing you can call to show the control without a user having to manually pull the table down to initiate. That’s if you need to do this.

The next bit of code you need to author associates the table with the refresh control. You can do this in the TableViewController’s viewDidLoad.

- (void)viewDidLoad {
    UIRefreshControl *refresh = [[UIRefreshControl alloc] init];
    refresh.attributedTitle = [[NSAttributedString alloc] initWithString:@"Pull to refresh"];
    [refresh addTarget:self
             action:@selector(refreshMyTable:)
             forControlEvents:UIControlEventValueChanged];
    self.refreshControl = refresh;
}

Line number 7 above assigns the control to the TableViewController’s refreshControl property… so it’s assigned to the view controller and not the UITableView. There you have it…

You can do this stuff in InterfaceBuilder, but I’ve shown it here in code for you which should be a preferred method. It’s far easier to find what you need without doing the IB dance.