UITableView header view overlap cells in iOS 10

Question

There's a simple UITableView in my app, and there's a custom view for the tableView.tableHeaderView property. When this property is set, the view has the correct size (full width, about 45px high).

[_resultHeaderView sizeToFit]; // the view as the correct frame
[_resultTableView setTableHeaderView:_resultHeaderView];

In iOS 9 and previous versions, the header displays correctly, but in iOS 10, the cells start at the same Y coordinate as my header view, so my header view appears over the first cell.

Setting these properties also have no effect:

self.edgesForExtendedLayout = UIRectEdgeNone;
self.automaticallyAdjustsScrollViewInsets = NO;

Has something changed in iOS 10 that could explain this different behavior? What would be a good solution?

Thanks

Answer 1

The bug was in the fact that the view was being resized automatically, so its frame height really was 0 when it was being attached to the tableView, which explains the behavior.

Setting the autoresizingMask to none fixed this bug.

_headerView.autoresizingMask = UIViewAutoresizingNone

Again, it wasn't necessary in iOS 9 and below. Hope this helps someone else.

Answer 2

Here is a more Swift approach

tableView.tableHeaderView?.translatesAutoresizingMaskIntoConstraints = false

Or you can do it directly in your header

 myHeaderView.translatesAutoresizingMaskIntoConstraints = false

Also you must call these two delegate methods.

  func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        return yourHeaderView
    }
    
    func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 30 // Your preferred height
    }