使用 UITableView 的 tableHeaderView 约束,tableHeaderView 出现在单元格的顶部

问题描述

我正在使用约束和自动布局创建自定义 tableHeaderView。问题是我的 tableHeaderView 出现在单元格的顶部。

这是我的 viewDidLoad:

let tableView = UITableView()
view.addSubview(tableView)
tableView.translatesAutoresizingMaskIntoConstraints = false
tableView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
tableView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
tableView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true
tableView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true

//Adding subviews and setting constraints
let headerContainer = UIView()
let myView = UIView()
headerContainer.addSubview(myView)
//Setup constraints...

let myLabel = UILabel()
headerContainer.addSubview(myLabel)
//Adding many more views...

tableView.setAndLayoutTableHeaderView(header: headerContainer)

阅读这篇文章后,我已将建议的扩展名复制到 UITableView:Is it possible to use AutoLayout with UITableView's tableHeaderView?

extension UITableView {
    //set the tableHeaderView so that the required height can be determined,update the header's frame and set it again
    func setAndLayoutTableHeaderView(header: UIView) {
        self.tableHeaderView = header
        header.setNeedsLayout()
        header.layoutIfNeeded()
        print(header.systemLayoutSizefitting(UIView.layoutFittingCompressedSize).height) //Always 0???
        header.frame.size = header.systemLayoutSizefitting(UIView.layoutFittingCompressedSize)
        self.tableHeaderView = header
    }
}

问题是标题视图出现在单元格的顶部。在layoutIfNeeded和setNeedsLayout之后打印headerContainer的大小时,高度为0...

解决方法

当您自己维护框架时,可以简化为这样。

extension UITableView {

    func setAndLayoutTableHeaderView(header: UIView) {
        header.frame.size = header.systemLayoutSizeFitting(size: CGSize(width: self.frame.size.with,height: .greatestFiniteMagnitude))
        self.tableHeaderView = header
    }

}