Show Selection Highlight on UITableView Section Header When Touched

Question

By default on a UITableView, when you touch a cell, it goes into selected mode, and is highlighted grey.

In our app, you can touch a header and it goes on to another page.

We want users to get the same kind of visual feedback when they touch a section, as when they they touch a cell. That is, it responds by going into a "selected" mode and making the background go a bit darker to indicate selection.

This does not occur when you touch a UITableView section. The section does not go into selection mode. It does not turn grey.

We've tried putting in a transparent button that spans a custom UIView with a background image and enabling "Reverses on Highlight", but the result is not very responsive and sucks.

What's the best strategy for implementing such functionality?

Answer 1

I would suggest subclassing UIGestureRecognizer to get the touchDown event, as pointed out in this post: Touch Down Gesture

You can then add the gesture recognizer to your UITableViewHeaderFooterView in viewForHeaderInSection and when it fires, grab the index path of the "selected cell." It will be null for the first section for some reason, but will have the correct indexPath.section for all other sections:

CGPoint point = [touchDown locationInView:self.tableView];
NSIndexPath *indexPath = [self.tableView indexPathForRowAtPoint:point];

Then just change the background color of your header cell. You'll probably want to wipe out the color on your header when tapping another header or cell or whatever, so hold on to the cell whenever you change its background:

// declare an instance UITableViewHeaderFooterView earlier
if(header)
    [[header contentView] setBackgroundColor:[UIColor lightGrayColor]];  // or whatever your default is

if(indexPath)
{
    header = [self.tableView headerViewForSection:indexPath.section];
    [[[self.tableView headerViewForSection:indexPath.section] contentView] setBackgroundColor:[UIColor greenColor]];  // or whatever color you want
}
else
{
    header = [self.tableView headerViewForSection:0];
    [[[self.tableView headerViewForSection:0] contentView] setBackgroundColor:[UIColor greenColor]];
}