How to add a search Icon as section for SearchBar in UITableView using search controller

Question

I am trying to add the image for search (magnifying glass) as the section, to easily go to the search bar.

This is the issue I am experiencing:

My code to setup the sections is as follows:

Note: self.fbFriends is an Array of Dictionaries that include the facebook friends of the user.

self.fbFriends = [[NSArray alloc] initWithArray:[[MESCache sharedCache] facebookFriends]];
self.searchResults = [[NSMutableArray alloc] init];
self.sections = [[NSMutableDictionary alloc] init];

BOOL found;

[self.sections setValue:[[NSMutableArray alloc] init] forKey:UITableViewIndexSearch];

// Loop through the friends and create our keys
for (NSDictionary *friend in self.fbFriends)
{
    NSString *c = [[friend objectForKey:@"name"] substringToIndex:1];

    found = NO;

    for (NSString *str in [self.sections allKeys])
    {
        if ([str isEqualToString:c])
        {
            found = YES;
        }
    }

    if (!found)
    {
        [self.sections setValue:[[NSMutableArray alloc] init] forKey:c];
    }
}

// Loop again and sort the friends into their respective keys
for (NSDictionary *friend in self.fbFriends)
{
    [[self.sections objectForKey:[[friend objectForKey:@"name"] substringToIndex:1]] addObject:friend];
}

// Sort each section array
for (NSString *key in [self.sections allKeys])
{
    [[self.sections objectForKey:key] sortUsingDescriptors:[NSArray arrayWithObject:[NSSortDescriptor sortDescriptorWithKey:@"name" ascending:YES]]];
}

Here is my section setup and header views:

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    if (tableView == self.searchDisplayController.searchResultsTableView) {
        return 1;
    } else {
        return [[self.sections allKeys] count];
    }
}
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
    if (tableView == self.searchDisplayController.searchResultsTableView) {
        return NSLocalizedString(@"FbFriendsSearchControllerSection", @"Fb Friends search controller - section title for search results table view");
    } else {
        return [[[self.sections allKeys] sortedArrayUsingSelector:@selector(localizedCaseInsensitiveCompare:)] objectAtIndex:section];
    }
}

Does anyone see how this is incorrect?

Answer 1

This is not a standard practice. There is no need for the extra section just to show a search.

Don't add the "search" section to your self.sections dictionary. Instead, you just have sections for the actual data. Then in your tableView:sectionForSectionIndexTitle:atIndex: method you can do:

- (NSInteger)tableView:(UITableView *)tableView sectionForSectionIndexTitle:(NSString *)title atIndex:(NSInteger)index {
    NSInteger res = 0;
    if (tableView == self.tableView) {
        if (index == 0) {
            // If the user taps the search icon, scroll the table view to the top
            res = -1;
            [self.tableView setContentOffset:CGPointMake(0, 0) animated:NO];
        } else {
            res = ... // return the proper index for your data
        }
    } else {
        res = 0;
    }

    return res;
}

Side note - you really want to have an array of dictionaries. The main array should represent the sections. As you have it now, you are constantly getting your main dictionary's keys and sorting them. This will be done MANY times - all needlessly. Using an array lets you quickly get the data from the section index.