Не могу изменить цвет tableHeaderView для UITableView. (Не заголовок раздела!)

Question

Мне нужен заголовок для моего UITableView. Заголовок раздела не работает для меня, потому что он не должен прокручиваться с ячейками.

Поэтому я добавил tableView.tableHeaderView следующим образом:

 // ViewController

 tableView.tableFooterView = UIView()
 let header = SearchPopularHeaderView()
 header.height(36)
 tableView.tableHeaderView = header

 // ...

 // SearchPopularHeaderView

class SearchPopularHeaderView: UIView {

    private var lblTitle: UILabel!

    override init(frame: CGRect) {
        super.init(frame: frame)

        viewDidLoad()
    }

    required init?(coder: NSCoder) {
        super.init(coder: coder)

        viewDidLoad()
    }

    private func viewDidLoad() {
        lblTitle = UILabel()
        lblTitle.text = "Most popular".localized()
        lblTitle.font = UIFont.systemFont(ofSize: 12, weight: .bold)
        lblTitle.textColor = UIColor("#e6f2f9")
        self.addSubview(lblTitle)

        lblTitle.centerY(to: self)
        lblTitle.leadingToSuperview(offset: 16)

        self.backgroundColor = UIColor("#3c4958")

        layoutIfNeeded()
    }
}

Я пытался, и это не работает:

Добавление нового вида контейнера для метки, обрезка его до суперпредставления и изменение цвета для этого вида контейнера. Похоже, что UIView наследует цвет от UITableView.

Вопрос: Возможно, кто-то сталкивался с некоторыми проблемами и знает, как изменить цвет tableHeaderView?

---

PS Пожалуйста, ответы, связанные с tableHeaderView, я знаю про вариант сделать его как заголовок раздела или просто ячейку. Спасибо.

Answer 1

Используйте это расширение для установки headerView

extension UITableView {

    /// Set table header view & add Auto layout.
    func setTableHeaderView(headerView: UIView) {
        headerView.translatesAutoresizingMaskIntoConstraints = false

        // Set first.
        self.tableHeaderView = headerView

        // Then setup AutoLayout.
        headerView.centerXAnchor.constraint(equalTo: self.centerXAnchor).isActive = true
        headerView.widthAnchor.constraint(equalTo: self.widthAnchor).isActive = true
        headerView.topAnchor.constraint(equalTo: self.topAnchor).isActive = true
    }

    /// Update header view's frame.
    func updateHeaderViewFrame() {
        guard let headerView = self.tableHeaderView else { return }

        // Update the size of the header based on its internal content.
        headerView.layoutIfNeeded()

        // ***Trigger table view to know that header should be updated.
        let header = self.tableHeaderView
        self.tableHeaderView = header
    }
}

, затем в вашем контроллере

override func viewDidLoad() {
        super.viewDidLoad()

     let hView = UIView()
     self.tableView.setTableHeaderView(headerView: hView)

    NSLayoutConstraint.activate([
        hView.heightAnchor.constraint(equalToConstant: 100),
    ])
    self.tableView.updateHeaderViewFrame()

}

Answer 2

Проблема была очень простой, просто установить ограничение width для моего представления заголовка.

// With 'TinyConstraints'

let hView = SearchPopularHeaderView()
self.tableView.tableHeaderView = hView
sectionHeaderHeight = hView.height(36)
hView.width(to: sview.tableView)

// Without 'TinyConstraints'

let hView = SearchPopularHeaderView()
sview.tableView.tableHeaderView = hView
NSLayoutConstraint.activate([
  hView.heightAnchor.constraint(equalToConstant: 36),
  hView.widthAnchor.constraint(equalTo: self.tableView.widthAnchor)
])

PS Спасибо @jawadAli за помощь в обнаружении проблемы.

Библиотека PSS для ограничений TinyConstraints