UITableViewHeaderFooterView: Unable to change background color

Question

I\'m trying to change the background color of UITableViewHeaderFooterView. Although the view is appearing, the background color remains the default color. I\'m getting a log

Answer 1

iOS 8, 9, 10, 11...

The only way to set any color (with any alpha) is to use backgroundView:

Swift

self.backgroundView = UIView(frame: self.bounds)
self.backgroundView.backgroundColor = UIColor(white: 0.5, alpha: 0.5)

Obj-C

self.backgroundView = ({
    UIView * view = [[UIView alloc] initWithFrame:self.bounds];
    view.backgroundColor = [UIColor colorWithWhite: 0.5 alpha:0.5];
    view;
    });

---

Responses to Comments

• None of these other options reliably work (despite the comments below)

  // self.contentView.backgroundColor = [UIColor clearColor];
  // self.backgroundColor = [UIColor clearColor];
  // self.tintColor = [UIColor clearColor];
  

• the backgroundView is resized automatically. (No need to add constraints)

• Control alpha with UIColor(white: 0.5, alpha: 0.5) or backgroundView.alpha = 0.5.
  (of course, any color will do)

• When using XIB, make root view a UITableViewHeaderFooterView and associate the backgroundView programmatically:

  Register with:

  tableView.register(UINib(nibName: "View", bundle: nil),
                     forHeaderFooterViewReuseIdentifier: "header")
  

  Load with:

  override func tableView(_ tableView: UITableView,
                          viewForHeaderInSection section: Int) -> UIView? {
      if let header =
          tableView.dequeueReusableHeaderFooterView(withIdentifier: "header") {
          let backgroundView = UIView(frame: header.bounds)
          backgroundView.backgroundColor = UIColor(white: 0.5, alpha: 0.5)
          header.backgroundView = backgroundView
          return header
      }
      return nil
  }
  

---

↻ replay animation

► Find this solution on GitHub and additional details on Swift Recipes.

Answer 2

In interface builder pull up your .xib, on the top element, in attribute inspector set the background color to default. Then go to the Content View and set the background color there (reference to https://github.com/jiecao-fm/SwiftTheme/issues/24).

Answer 3

In iOS 7 contentView.backgroundColor worked for me, tintColor did not.

   headerView.contentView.backgroundColor = [UIColor blackColor];

Though clearColor did not work for me, the solution I found is to set backgroundView property to transparent image. Maybe it will help someone:

UIGraphicsBeginImageContextWithOptions(CGSizeMake(1, 1), NO, 0.0);
UIImage *blank = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

headerView.backgroundView = [[UIImageView alloc] initWithImage:blank];

Answer 4

I tried with the appearanceWhenContainedIn chain, and it worked for me.

[[UIView appearanceWhenContainedIn:[UITableViewHeaderFooterView class], [UITableView class], nil] 
         setBackgroundColor: [UIColor.grayColor]];

Answer 5

I feel compelled to share my experience. I had this piece of code that worked fine with iOS 10 and iOS 11 headerView?.contentView.backgroundColor = .lightGray

Then I all of a sudden decided to to deploy the app for iOS 9 as there are some devices (iPad mini some older generation doesn't update to any OS beyond 9) - The only solution that worked for all iOS 9, 10 and 11 was to define a base view for the header that then contains all other header subviews, wire it up from storyboard and set the backgroundColor of that base view.

You will want to be mindful when wiring the outlet not to call it: backgroundView as there is already a property with that name in some superclass. I called mine containingView

Also when wiring the outlet control click on the view in Document Outline to make sure it's not wired up to file owner

Answer 6

Put this code in initializing of your UITableViewHeaderFooterView subclass:

let bgView = UIView()
bgView.backgroundColor = UIColor.clear
backgroundView = bgView
backgroundColor = UIColor.clear
contentView.backgroundColor = UIColor.clear