Different coloured section header backgrounds

420 views Asked by At

I have three sections in my tableView. I am trying to set different background colours to each of the section headers. This is the example I have found to set the section colours, but I have not found a way to set different colours yet, is this possible?

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section
{
    // Background color
    view.tintColor = [UIColor blackColor];

    // Text Color
    UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;
    [header.textLabel setTextColor:[UIColor whiteColor]];

    // Another way to set the background color
    // Note: does not preserve gradient effect of original header
    // header.contentView.backgroundColor = [UIColor blackColor];
}
3

There are 3 answers

3
Bannings On

You can try this:

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
    static NSArray *backgroundColors;
    static NSArray *titleColors;

    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        backgroundColors = @[[UIColor blackColor], [UIColor redColor]];
        titleColors = @[[UIColor blackColor], [UIColor redColor]];
    });

    // Background color
    view.tintColor = backgroundColors[section];

    // Text Color
    UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;
    [header.textLabel setTextColor:titleColors[section]];

    // header.contentView.backgroundColor = colors[section];
}
2
Badal Shah On

you can set different background color in this way.

Adjust According to your Header Title and Color

Here is my Example:-

-(void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
UITableViewHeaderFooterView * headerview = (UITableViewHeaderFooterView *)view;
if (section==0)
{
headerview.contentView.backgroundColor = [UIColor colorWithRed:0.90 green:0.60 blue:0.00 alpha:1.0];
headerview.textLabel.textColor = [UIColor whiteColor];
}
if (section==1) {
    headerview.contentView.backgroundColor = [UIColor colorWithRed:0.50 green:0.0 blue:0.20 alpha:1.0];
    headerview.textLabel.textColor = [UIColor whiteColor];
}

}

Edit :

To set section empty you need to make array of section. Example:-

    secnm=[[NSArray alloc]initWithObjects:@"",@"Friends", nil];
// Declaration of section array(set section according to your need)

you need to set "" to make empty section means without header. and then set colour from your section 1 or sec 2 according to your requirement

 -(void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
UITableViewHeaderFooterView * headerview = (UITableViewHeaderFooterView *)view;
 if (section==1) (set index according to your section)
{
    headerview.contentView.backgroundColor = [UIColor colorWithRed:0.90 green:0.60 blue:0.00 alpha:1.0];
    headerview.textLabel.textColor = [UIColor whiteColor];
 }

 }

Result :-

Section without header and with header

0
iphonic On

You can define an array of colours for your 3 sections like

NSArray *headerColors=@[[UIColor greenColor],[UIColor yellowColor],[UIColor redColor]];

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section
{
    // Background color
    view.tintColor = [headerColors objectAtIndex:section];

    // Text Color
    UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;
    [header.textLabel setTextColor:[UIColor whiteColor]];

    // Another way to set the background color
    // Note: does not preserve gradient effect of original header
    // header.contentView.backgroundColor = [UIColor blackColor];
}