Uko
Uko

Reputation: 13386

UITableView Activity Indicator the Apple way

My problem is pretty common. I want to show some "loading" stuff while the data that will be shown in a table is being downloaded. But all the solutions I've seen this far is either to add some spinners to cells, or put some semi-transparent view over the app.

What I want to active is the thing that apple does in its apps (for example YouTube). Like, the spinning wheel with word "Loading" is shown on the white background, and then the data is shown.

I have also seen some solution with a grouped style, but my table has a plain style so it isn't helping me a lot I think.

EDIT

My final code looks like this:

- (void)loadImagesData
{
    UIView *tableView = self.view;
    self.view = [[LoadingView alloc] initWithFrame:CGRectMake(0, 0, 320, 367)];
    dispatch_queue_t downloadQueue = dispatch_queue_create("flickr downloader", NULL);
    dispatch_async(downloadQueue, ^{
        NSArray *images = [FlickrFetcher photosInPlace:self.place maxResults:MAX_PHOTOS];
        dispatch_async(dispatch_get_main_queue(), ^{
            self.view=tableView;
            self.imagesData = images;
        });
    });
    dispatch_release(downloadQueue);
}

and imageData setter calls reloadData on table view.

Upvotes: 3

Views: 11674

Answers (2)

Nahouto
Nahouto

Reputation: 1385

Another answer to show an activity indicator inside a UITableViewController, without changing it to a UIViewController.

  1. In the storyboard, add an activity indicator inside the table view (but not above the TableViewCell !). It will be inside the table view header (not section header !)

  2. Connect the outlet of the activity indicator to your class file

    @IBOutlet weak var activityIndicator: UIActivityIndicatorView!
    
  3. Use these functions to show or hide the activity indicator

    // enable tableview and hide the activity indicator
    func activateScreen() {
    self.tableView.tableHeaderView?.frame = CGRect(x: 0, y: 0, width: tableView.frame.width, height: 0)
    self.tableView.tableHeaderView = self.tableView.tableHeaderView // necessary to really set the frame
    activityIndicator.stopAnimating()
    }
    
    // disable tableview animate the activity indicator
    func disactivateScreen() {
    self.tableView.tableHeaderView?.frame = tableView.frame
    self.tableView.tableHeaderView = self.tableView.tableHeaderView // necessary to really set the frame
    activityIndicator.startAnimating()
    }
    

Enjoy !

Upvotes: 2

Alladinian
Alladinian

Reputation: 35636

  1. Create a UIViewController (not a UITableViewController - even if you are about to present a table)
  2. Create your "Loading" view and add it as an outlet
  3. Create your tableview and add it as an outlet too
  4. When the controller is presented set its view property to point to your "Loading" view. When all tasks have completed, switch the view with the tableview

Just don't forget to add protocols and methods involved in order to control your tableview

I hope that this will help you

Upvotes: 10

Related Questions