uitableview - iOS SearchDisplayController prevents tableview from background color change (background stays gray)

Question

This might be a bug in iOS 7: I used storyboard to drag in Search Bar and Search Display Controller in my tableview controller. The background color of my tableview is altered after that. I am using an example from AppCoda's "how-to-add-search-bar-uitableview" to demo this issue. I only changed the example code with 1-line add-on in ViewDidLoad:

   [_tableView setBackgroundColor:[UIColor blackColor]];

See my screenshots here:

1. The bottom of the tableview has already changed to black:

2. But the top stays as gray though tableview's background was set to black: This only happens when I drag in "Search Bar and Search Display Controller". If I remove the "Search Display Controller" from storyboard, it's all good.

Answer 1

When using a UISearchDisplayController in a UITableViewController, it is very important to remember that you are dealing with two table views.

So when you drag a "Search Bar and Search Display Controller" into a UITableView (and assuming you are doing this drag in a UIStoryboard), you are actually added another UITableView that, when activated, must be managed by code in your UITableViewController file in the same manner as any other UITableView.

Consider this:

The UITableView that represents the complete data set can be called using self.tableView (or as you have written, the synthesised _tableView).

The UITableView that represents the filtered data set (filtered using your search criteria) can be called using self.searchDisplayController.searchResultsTableView

If you'd like both your default UITableView and search UITableView background colour to display a black colour, I can suggest this code (works in a TVC in my app)...

- (void)viewDidLoad {
    [super viewDidLoad];

    [self.tableView setBackgroundView:nil];
    [self.tableView setBackgroundColor:[UIColor blackColor]];

    [self.searchDisplayController.searchResultsTableView setBackgroundView:nil];
    [self.searchDisplayController.searchResultsTableView setBackgroundColor:[UIColor blackColor]];
}

...

UPDATE

Now that I have finished my long-winded lecture, I agree that there is in fact a "bug" of sorts in Xcode. If you delete the original UISearchBar and then add a new one to a UITableViewController, before you connect it, do a Build & Run. A black background is visible below and above the table view. It is only after you set the UISearchBar as an outlet for the UISearchDisplayController that the black background is "replaced" with a grey background.

So the solution...

With thanks to Olof's answer to Different background colors for the top and bottom of a UITableView.

REPLACE the code I have written above with this code, at the end of your viewDidLoad method:

- (void)viewDidLoad {
    [super viewDidLoad];

    ...<other code>...

    CGRect frame = self.tableView.bounds;
    frame.origin.y = -frame.size.height;
    UIView* viewBackgroundBlack = [[UIView alloc] initWithFrame:frame];
    [viewBackgroundBlack setBackgroundColor:[UIColor blackColor]];
    [self.tableView addSubview:viewBackgroundBlack];

    [self.tableView setBackgroundView:nil];
    [self.tableView setBackgroundColor:[UIColor blackColor]];

    [self.searchDisplayController.searchResultsTableView setBackgroundView:nil];
    [self.searchDisplayController.searchResultsTableView setBackgroundColor:[UIColor blackColor]];
}