iOS Tips: Pull to Refresh in less than 30 seconds
Using Xcode
Pull to Refresh is a common idiom on iOS—originally made popular by the folks at Twitter. This approach to refreshing a view has become so ubiquitous Xcode now enables you to add this feature to your views in just a few simple steps. This post is about how to do exactly that… in 30 seconds!
Before we start the clock, create a new project in Xcode—containing a storyboard with a UITableViewController and a backing code file for the view controller; with that in place, we’re ready to start.
- In Xcode, in Main.storyboard, in the Document Outline pane, select View Controller, and then select the Attribute Inspector on the Utilities pane.
- In Attribute Inspector, in Table View Controller, change Refreshing from Disabled to Enabled.
Notice in the Document Outline pane that there is now a new control called Refresh Control.
- If not already visible, open the Assistant Editor for the View Controller.
- In Document Outline, press CTRL, and then click Refresh Control and drag to the buddy file, release to complete the drag operation when the cursor is between the @interface and @end code elements.
- Create a new Action, called refresh, and change the Type from id to UIRefreshControl.
This generates a method at the end of the code file called refresh: that passes in one parameter of type UIRefreshControl.
- Scroll to the end of the code file, and then add your code to refresh your data source.
After your data source has finished loading data you must send a endRefreshing message to the UIRefreshControl to restore the UI back to normal, as you can see on line 50 above.
- Stop the clock!
I have created a sample project that you can use if you want to see this approach in action.