CODEWITHSUNDEEP
iphoneuikituitableview
toofah
toofah

Reputation: 4475

Changing the color of UITableView section headers

OK, I know that this has been asked previously, so please forgive me for asking again. It just seems like there has got to be an easier way to do this.

Is there a 'simple' way to change the UITableView section header background color? I know that I can use the delegate method 'viewForHeaderInSection' to hand the UITableView a custom UIView to use for the section headers, but all I really want to do is set the 'tintColor'. There is a tintColor property on the search bar, why not for the section headers.

If I use viewForHeaderInSection to create my own custom UIView, I have to create my own label as well. I have to style and position my label to look just like the rest of the Apple standard. I have to style and size the 'background' to look like the rest of the Apple standard.

I can't find a way to simply ask for the section header and then change it's color. Am I missing something or do I really have to do this the hard way.

If I have to do this the hard way, does someone have all of the styling information that matches the Apple standard? - bar is 'translucent' - bar has some shading on the top and the bottom - label has a certain size, position, shadings, etc

Thanks. And once again, sorry for asking this question again.

Upvotes: 19

Views: 14987

Answers (6)

Muhammad Ahmad
Muhammad Ahmad

Reputation: 398

we can change the header background color like this : 

func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int){         
      let tableHeader = view as! UITableViewHeaderFooterView        
      tableHeader.backgroundView?.backgroundColor = UIColor.white     
    }

Upvotes: 0

George Brown
George Brown

Reputation: 1144

The UIAppearance method appearanceWhenContainedIn has been deprecated as of iOS 9.0; instead you can still do the exact same thing with the appearanceWhenContainedInInstancesOfClasses method and an array.

[UILabel appearanceWhenContainedInInstancesOfClasses:@[[UITableViewHeaderFooterView class]]].textColor = [UIColor darkTextColor];

Upvotes: 2

Bjinse
Bjinse

Reputation: 1359

If you change the appearance, like in the other answers, it is application wide. If you want to change just for a specific tableview, implement:

-(void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
  UITableViewHeaderFooterView * headerview = (UITableViewHeaderFooterView *)view;
  headerview.contentView.backgroundColor = [UIColor greenColor];
  headerview.textLabel.textColor = [UIColor whiteColor];
}

Upvotes: 8

Sokolof
Sokolof

Reputation: 2301

With UIAppearance you can change UILabel text color on your UITableView headers like this:

[[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setTextColor:[UIColor whiteColor]];
[[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setShadowColor:[UIColor whiteColor]];

Should work on iOS 6.0+. Can be called anywhere (viewDidLoad etc).

Upvotes: 21

Mason G. Zhwiti
Mason G. Zhwiti

Reputation: 6540

With the newer UIAppearance way of doing things, in versions > iOS 6.0 you can just do, for example:

[[UITableViewHeaderFooterView appearance] setTintColor:[UIColor redColor]];

Upvotes: 30

neilkimmett
neilkimmett

Reputation: 837

This is something I spent quite a while grappling with myself, only to find that there is no way to just change the tintColor of the section header. The solution I came up with was to screenshot the background of the section header, change the tint of it in Photoshop, and then use that as the background of the section header. Then its just a case of laying out the label.

As you said, the thing to use is the viewForHeaderInSection delegate method.

Here is what I've found works and looks like the Apple default:

UIView *customView = [[[UIView alloc] initWithFrame:CGRectMake(10.0, 0.0, 320.0, 22.0)] autorelease];
customView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"headerbackground.png"]];;

UILabel *headerLabel = [[[UILabel alloc] initWithFrame:CGRectZero] autorelease];
headerLabel.backgroundColor = [UIColor clearColor];
headerLabel.opaque = NO;
headerLabel.textColor = [UIColor whiteColor];
headerLabel.font = [UIFont boldSystemFontOfSize:18];
headerLabel.shadowOffset = CGSizeMake(0.0f, 1.0f);
headerLabel.shadowColor = [UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.5];
headerLabel.frame = CGRectMake(11,-11, 320.0, 44.0);
headerLabel.textAlignment = UITextAlignmentLeft;
headerLabel.text = @"Header Label";
[customView addSubview:headerLabel];
return customView;

Here "headerbackground.png" is a 1 pixel by 22 pixel (double that for iPhone 4) image that will get repeated across the length of the header.

Hope this helps!

Upvotes: 12

Related Questions