iOS Adding Image to Tableview Background View - ios

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

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];
});
});
}

Answer 2

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.