iOS将图像添加到Tableview背景视图

Question

I have a tableview that I am using to display data loaded from a web service. Sometimes it loads fast, other times it take awhile. While it's loading, the tableview just shows a blank screen (in my case it is a gray screen). I want to display in the tableview background view a simple image that says loading and has a loading icon that I will animate to spin, but I cannot get it to show up at all. Here is my code:

UIView *backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, self.view.bounds.size.height)];
[backgroundView setBackgroundColor:[UIColor colorWithRed:227.0 / 255.0 green:227.0 / 255.0 blue:227.0 / 255.0 alpha:1.0]];

self.tableLoading.image = [UIImage imageNamed:@"loading.png"];
self.tableLoading.frame = CGRectMake(145, 80, 30, 30);
[backgroundView addSubview:self.tableLoading];

[self.feedTableView setBackgroundView:backgroundView];

The background view shows up as expected, hence the gray background, but I CANNOT get the image to show up at all.

Any suggestions? This seems like a simple problem but I have already spent a long time at it with no success. Thanks in advance!

Answer 1

How are you doing your webservice call? I suppose it's done on an asynchronous block. Maybe something like AFNetworking NSOperation block? If so, where are you setting the image as a background? All user interface (UI) stuff should not be done on a background thread, it should be done on the main thread since the main thread is the only one who should be involved to UI.

Try the following:

 dispatch_async(dispatch_get_main_queue(), ^{

    UIView *backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, self.view.bounds.size.height)];
    [backgroundView setBackgroundColor:[UIColor colorWithRed:227.0 / 255.0 green:227.0 / 255.0 blue:227.0 / 255.0 alpha:1.0]];

    self.tableLoading.image = [UIImage imageNamed:@"loading.png"];
    self.tableLoading.frame = CGRectMake(145, 80, 30, 30);
    [backgroundView addSubview:self.tableLoading];

    [self.feedTableView setBackgroundView:backgroundView];

});

You can start displaying the UITableView background image when you start the request, and just dismiss it right after the request is finishing networking.

For instance, SLRequest has a sending request method called performRequestWithHandler: which has a handler to be called when the request is done, within that handler, you can dismiss the custom indicator or remove it from your view controller.

Hope this help.

Answer 2

You can avoid using your UIView and instead you can use an activity indicator. Try something like this:

-(void)viewDidLoad{
    UIView *backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, self.view.bounds.size.height)];
    backgroundView.tag=1;
    [backgroundView setBackgroundColor:[UIColor colorWithRed:227.0 / 255.0 green:227.0 / 255.0 blue:227.0 / 255.0 alpha:1.0]];

    self.tableLoading.image = [UIImage imageNamed:@"loading.png"];
    self.tableLoading.frame = CGRectMake(145, 80, 30, 30);

    [backgroundView addSubview:self.tableLoading];
    [self.view addSubview:backgroundView];
    dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
    // Do your web service call asynchronous
        dispatch_sync(dispatch_get_main_queue(), ^{
            //All UI needs to be here, in this thread
            // remove from superview your loading image to show your tableview content
            for (UIView *subview in [self.view subviews]) {
                if (subview.tag == 1) {
                    [subview removeFromSuperview];
                }
            }
            [self.yourTableView reloadData];
        });
    });
}