UITableview section color

Does it possible to set background color for each section in UITableView separately, not for the whole UITableView?

Replies

I don't think it is possible directly ; you have to insert a view:

https://stackoverflow.com/questions/11710305/uitableview-section-background

You can place a view behind your table view, set the table view's background colour to [UIColor clearColor] and you will see the view behind

[self.view addSubview:self.sectionBackgroundView];

[self.view addSubview:self.tableView];

self.tableView.backgroundColor = [UIColor clearColor];

the drawback to this is that this will not be only limited to the section you want, one way I can think of to make sure this backing view is limited to one section only is to adjust the frame of the backing view to the area covered by the section whenever the table view is scrolled


- (void)scrollViewDidScroll:(UIScrollView *)scrollView

{

CGRect sectionFrame = [self.tableView rectForSection:sectionWithBackground];

self.sectionBackgroundView.frame = sectionFrame;

}

you will need to do this at the start (probably in viewWillAppear:) as well to make sure the view starts off correctly.


But that seems to create some side effects when scrolling.


Otherwise, you can change the section header background color:

https://stackoverflow.com/questions/813068/uitableview-change-section-header-color/813103

Thanks but that don't work. I've tried the same trich with the shadow sticked to the last section's cell.

The problem: It cannot handle batchUpdates animations. When I insert, delete rows and section size changes, sticked view does not being animated. Ok, seems like that is impossible, I've searched everywhere.

It is said to have side effect on scrolling (requiring some patch) ; so no surprise it has effect on batchUpdate.


I would advise to just set the section header bgColor.


And file a feedback request for improvement.

Section header is just another cell technically, I was need background under the whole section)) But ok, I’ll use another solution. No way to set section BG.

hi mr.bodich,


i'm not sure this is on point, but if you want all the tableViewCells in a given section to have the same background color, then just assign that background color to each cell.


if say you have just two sections (0, 1), colored green and red, then use something like this:


let sectionColors: [UIColor] = [.green, .red]

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
  let cell = tableView.dequeueReusableCell(withIdentifier: "some cell identifier", for: indexPath)
  // set up the cell with whatever data it needs
  cell.backgroundColor = sectionColors[indexPath.section]
  return cell
  }


if you also want to tweak the color in the section header for each section, then supply a custom header with something like this:


(1) in your viewDidLoad() function, include a definition of what you use for a class for the section headers. (i usually define this using its own .xib)


tableView.register(MyTableViewSectionHeaderCell.nib, forHeaderFooterViewReuseIdentifier: TableViewSectionHeaderCell.identifier)


(2) and then override viewForHeaderInSection:


override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    guard let cell = tableView.dequeueReusableHeaderFooterView(withIdentifier: TableViewSectionHeaderCell.identifier) as? TableViewSectionHeaderCell else {
      return nil
    }
    // set the title and whatever else
    cell.backgroundColor = sectionColors[section]
    return cell
}


i don't wish to be too cryptic about the last few lines above, since you'll have to set up an .xib with a UITableViewCell, so go back to take a look at this related discussion: How to design a table header in IB


as for that last section's extra space at the bottom, just set tableView.sectionFooterHeight = 0.0 in viewDidLoad.


hope that helps,

DMG

Oh sorry for the confusion. I might described the situation not enough in question... thanks for trying to help, but I already designed all tableView, did 3 sections, 2 of them have cells with white background, 1 transparent, they designed in xib. That is all done and I would not waste your time with simple questions like setting cell bg))) The problem is: I have an image under the tableview, let’s say grey, tableview bg is .clear. Cells are .white. When I: 1. change tableview scale, 2. animate tableview updates like add/move/remove row — tiny gaps appear/disappear fast between some cells randomly and it looks like tiny blinking grey lines where bg under tableview is visible.