Setting the style of UITableView section headers

20
votes

I'm working with iOS 5 and have dynamically generated cells in a table (2 sections of 3 rows each). Each section has a header that is also dynamically generated using the titleForHeaderInSection call.

I also have an image set as the background for the table that makes the default color of the section headers hard to read. I haven't found a way to change the color of the section headers (or shadow color, font, text size, etc for that matter) either through the Storyboard interface or programmatically! Please help!

5
uitableviewios5xcode4.2

5 Answers

37
votes

This also works in iOS5+. It applies to all of the section headers and footers in the tableview and suited my needs.

- (void)viewDidLoad
{
    [super viewDidLoad];

    [[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setFont:[UIFont fontWithName:@"MyFont" size:8]];
}

Dan

17
votes

You can modify the font size/color/etc by creating your own view for the section header using the method tableView:viewForHeaderInSection:

There's an example of this technique here

13
votes

The actual easiest way

If you're not doing too much modification, for example just changing the font or colors:

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section
{
    UITableViewHeaderFooterView *tableViewHeaderFooterView = (UITableViewHeaderFooterView *)view;
    tableViewHeaderFooterView.textLabel.font = [UIFont fontWithName:@"HelveticaNeue-Light" size:12.0f];
    tableViewHeaderFooterView.textLabel.textColor = [UIColor colorWithRed:0.27f green:0.27f blue:0.27f alpha:1.0f];
    tableViewHeaderFooterView.contentView.backgroundColor = [UIColor colorWithRed:0.87f green:0.87f blue:0.87f alpha:1.0f];
}
7
votes

The UITableViewHeaderFooterView class implements a reusable view that can be placed at the top or bottom of a table section. You use headers and footers to display additional information for that section.

Availability: iOS (6.0 and later)

Example:

[[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setColor:[UIColor whiteColor]];
0
votes

The easiest way to get a custom section header - use a cell!

Very Similar to the technique used for

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

You can create an instance of a cell prototype that you provide. If your cell includes an outlet for a label, you can set it before returning it:

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger) section
{
    SessionTableViewCell *cell;
    cell = [tableView dequeueReusableCellWithIdentifier:@"SessionSectionHeader"];
    if (cell == nil) {
        cell = [[SessionTableViewCell alloc]
               initWithStyle:UITableViewCellStyleDefault
             reuseIdentifier:@"SessionSectionHeader"];
    }
    cell.myLabel.text = myTitles[section];
    return cell;
}

Note that @"SessionSectionHeader" is the identifier in the storyboard for our cell prototype.

HTH!