如何防止UITableView头部被下一个头部替换？解决高度动画UI异常

首先，咱们先搞定Section Header不被下一个Header替换（也就是实现Header紧贴）的问题——默认的UITableView Section Header是会悬浮在顶部的，直到下一个Section的Header把它顶走，这就是你看到的第一张图的情况。要让Header跟着Section内容一起滚动、互相紧贴，有两种靠谱的方案：

方案一：把Section Header做成Cell的一部分 #

这个方法最简单直接，不需要自定义布局，把每个Section的第一个Cell当成Header来用：

• 给TableView注册两种Cell：一种是专门的HeaderCell，另一种是普通内容Cell。
• 在numberOfRowsInSection里，每个Section返回「1（Header行）+ 实际内容行数」。
• 在cellForRowAt中，判断如果当前row是0，就返回HeaderCell并设置对应标题；否则返回内容Cell。

这样所有Header都是普通Cell的一部分，滚动时会跟着Section内容一起移动，自然就会紧贴在一起，不会出现悬浮替换的情况。

方案二：自定义TableViewLayout禁用Header悬浮 #

如果不想动Cell结构，可以自定义FlowLayout来强制Header跟着Section走：

class NonStickyHeaderLayout: UITableViewFlowLayout {
    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        guard let attributes = super.layoutAttributesForElements(in: rect) else { return nil }
        
        attributes.forEach { attr in
            // 只处理Section Header
            guard attr.representedElementKind == UICollectionView.elementKindSectionHeader,
                  let tableView = self.tableView else { return }
            
            let section = attr.indexPath.section
            let sectionFrame = calculateSectionFrame(for: section, in: tableView)
            // 强制Header的Y坐标等于Section的顶部，不悬浮
            attr.frame = CGRect(x: attr.frame.origin.x, y: sectionFrame.origin.y, width: attr.frame.width, height: attr.frame.height)
        }
        return attributes
    }

    override func shouldInvalidateLayout(forBoundsChange newBounds: CGRect) -> Bool {
        return true // 滚动时重新计算布局，保证Header位置正确
    }

    private func calculateSectionFrame(for section: Int, in tableView: UITableView) -> CGRect {
        let numberOfRows = tableView.numberOfRows(inSection: section)
        var sectionFrame = CGRect.zero
        
        if numberOfRows == 0 {
            // 空Section，Header高度就是设置的参考高度
            sectionFrame.size.height = headerReferenceSize.height
        } else {
            // 计算Section从Header到最后一行的整体范围
            let firstRowPath = IndexPath(row: 0, section: section)
            let lastRowPath = IndexPath(row: numberOfRows - 1, section: section)
            
            guard let firstRowFrame = layoutAttributesForRow(at: firstRowPath)?.frame,
                  let lastRowFrame = layoutAttributesForRow(at: lastRowPath)?.frame else { return .zero }
            
            sectionFrame = CGRect(
                x: 0,
                y: firstRowFrame.origin.y - headerReferenceSize.height,
                width: tableView.bounds.width,
                height: headerReferenceSize.height + lastRowFrame.maxY - firstRowFrame.origin.y
            )
        }
        
        // 计算当前Section相对于上一个Section的位置
        if section > 0 {
            let prevSectionFrame = calculateSectionFrame(for: section - 1, in: tableView)
            sectionFrame.origin.y = prevSectionFrame.maxY
        } else {
            // 第一个Section要考虑TableView的内边距
            sectionFrame.origin.y = tableView.contentOffset.y + tableView.adjustedContentInset.top
        }
        
        return sectionFrame
    }
}

然后给你的TableView设置这个布局：

tableView.collectionViewLayout = NonStickyHeaderLayout()

解决动画闪烁问题 #

你提到修改topView的heightConstraint时出现UI闪烁，核心原因是topView高度变化时，TableView的内容位置没有同步调整，导致滚动位置跳变。可以通过同步修改TableView的contentOffset或者contentInset来解决：

方法一：同步调整contentOffset #

// 记录旧高度
let oldHeight = topView.heightConstraint.constant
// 设置新高度
let newHeight = 100 // 你需要的新高度
let heightDelta = newHeight - oldHeight

UIView.animate(withDuration: 0.3) {
    self.topView.heightConstraint.constant = newHeight
    // 让TableView的内容跟着topView一起移动，避免跳变
    self.tableView.contentOffset = CGPoint(x: self.tableView.contentOffset.x, y: self.tableView.contentOffset.y - heightDelta)
    self.view.layoutIfNeeded()
}

方法二：调整contentInset #

如果你的TableView本来就有顶部内边距，也可以用这种方式：

let oldHeight = topView.heightConstraint.constant
let newHeight = 100
let heightDelta = newHeight - oldHeight

UIView.animate(withDuration: 0.3) {
    self.topView.heightConstraint.constant = newHeight
    var inset = self.tableView.contentInset
    inset.top += heightDelta
    self.tableView.contentInset = inset
    self.tableView.scrollIndicatorInsets = inset // 同步调整滚动指示器位置
    self.view.layoutIfNeeded()
}

另外还要注意：

• 动画期间不要调用reloadData，如果需要更新内容，用performBatchUpdates替代，更平滑。
• 确保所有布局更新都放在animate块里的layoutIfNeeded()调用前，避免重复计算布局导致闪烁。

内容的提问来源于stack exchange，提问作者Tysac