How can I access the standard viewForHeaderInSection for tableView?

Question

I have an indexed UITableView with separate sections. I would like to use a different background color for the headings in each section. I know that I can completely collapse my own view by implementing tableView: viewForHeaderInSection: (for example, see question # 2898361 ), but this seems like “too much work” for me - the standard view looks great, I just need to change its background color .

But how do I access this standard? I cannot use [super tableView:viewForHeaderInSection:] , because it is a protocol implementation issue, not an inheritance issue. Any other way to get a standard look?

Answer 1

I am pretty sure that you cannot do this easily. I used one of my technical support requests on my dev account recently, asking for a change in the background and borders of the UITableView sections. The apple engineer told me this wasn’t easy, and even if you succeeded, you probably would have affected performance. He also pointed me to cocoawithlove and an article on editing uitableviews:

http://cocoawithlove.com/2009/08/adding-shadow-effects-to-uitableview.html

Indeed, creating your own headline is not so much effort. Below is the code that I pulled from one of my projects - it was commented out, so it may not work right away, but you can get the idea:

  - (CAGradientLayer *) greyGradient { CAGradientLayer *gradient = [CAGradientLayer layer]; gradient.startPoint = CGPointMake(0.5, 0.0); gradient.endPoint = CGPointMake(0.5, 1.0); UIColor *color1 = [UIColor colorWithRed:255.0f/255.0f green:255.0f/255.0f blue:255.0f/255.0f alpha:1.0]; UIColor *color2 = [UIColor colorWithRed:240.0f/255.0f green:240.0f/255.0f blue:240.0f/255.0f alpha:1.0]; [gradient setColors:[NSArray arrayWithObjects:(id)color1.CGColor, (id)color2.CGColor, nil]]; return gradient; } - (UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section { CGFloat width = CGRectGetWidth(tableView.bounds); CGFloat height = [self tableView:tableView heightForHeaderInSection:section]; UIView *container = [[[UIView alloc] initWithFrame:CGRectMake(0,0,width,height)] autorelease]; container.layer.borderColor = [UIColor grayColor].CGColor; container.layer.borderWidth = 1.0f; CAGradientLayer *gradient = [self greyGradient]; gradient.frame = container.bounds; [container.layer addSublayer:gradient]; UILabel *headerLabel = [[[UILabel alloc] initWithFrame:CGRectMake(12,0,width,height)] autorelease]; headerLabel.backgroundColor = [UIColor clearColor]; headerLabel.font= [UIFont boldSystemFontOfSize:19.0f]; headerLabel.shadowOffset = CGSizeMake(1, 1); headerLabel.textColor = [UIColor whiteColor]; headerLabel.shadowColor = [UIColor darkGrayColor]; NSString *title = [self tableView:tableView titleForHeaderInSection:section]; headerLabel.text = title; return container; } 

Make sure that

 #import <QuartzCore/QuartzCore.h> 

By the way ... this should not mimic the appearance of standard headers - this is just an example. But I'm sure with a bit of trial and error that you could change to mimic the standard ones and then change the colors slightly.

Answer 2

Although the other answers point correctly, you cannot access the default view to make simple changes to it, if you have nothing to configure for a specific section title, you can return nil from tableView:viewForHeaderInSection: and the table view will use the default view .

This is useful if you only need to customize some of your headers.

For some reason this is undocumented .

Answer 3

There is one problem with @bandejapalsa's solution: the previous cell delimiter is still displayed with this implementation, where it is not in the default iOS section of the HeaderView. The solution I found is to use CALayer and offset it by 1 pixel. The image should be 1pix taller than the view frame itself.

 // Create the view for the header CGRect aFrame =CGRectMake(0, 0, tableView.contentSize.width, IMIUICustomisation.sectionHeaderViewHeight); UIView * aView = [[UIView alloc] initWithFrame:aFrame]; aView.backgroundColor = UIColor.clearColor; // Create a stretchable image for the background that emulates the default gradient, only in green UIImage *viewBackgroundImage = [[UIImage imageNamed:@"greenheader.png"] stretchableImageWithLeftCapWidth:12 topCapHeight:0]; // Cannot set this image directly as the background of the cell because // the background needs to be offset by 1pix at the top to cover the previous cell border (Alex Deplov requirement ^_^) CALayer *backgroungLayer = [CALayer layer]; backgroungLayer.frame = CGRectMake(0, -1, tableView.contentSize.width, IMIUICustomisation.sectionHeaderViewHeight+1); backgroungLayer.contents = (id) viewBackgroundImage.CGImage; backgroungLayer.masksToBounds = NO; backgroungLayer.opacity = 0.9; [aView.layer addSublayer:backgroungLayer]; // Take care of the section title now UILabel *aTitle = [[UILabel alloc] initWithFrame: CGRectMake(10, 0, aView.bounds.size.width-10, aView.bounds.size.height)]; aTitle.text = [delegate tableView:tableView titleForHeaderInSection:section]; aTitle.backgroundColor = UIColor.clearColor; aTitle.font = [UIFont boldSystemFontOfSize:18]; aTitle.textColor = UIColor.whiteColor; // Text shadow aTitle.layer.shadowOffset = CGSizeMake(0, 1); aTitle.layer.shadowRadius = .2; aTitle.layer.masksToBounds = NO; aTitle.layer.shadowOpacity = 0.5; aTitle.layer.shadowColor = IMIUICustomisation.selectedElementTextShadowColor.CGColor; [aView addSubview:aTitle]; return aView;