Resizing the tableView's tableHeaderView to account for an attributedText? - ios

Question

I want to make sure that my headerView inside a tableView is dynamically growing to account for the size of my attributed string.
This concept works fine with just autolayout for my cell-views without much work.
However I am having problems with the header (a UIView) and so I am trying to calculate it's height by hand but for some reason the height given by this code is too small?
func setupTableHeader () {
let str = "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?"
let attributedStr = NSAttributedString(string: str)
headerViewLabel.attributedText = attributedStr
let rect = attributedStr.boundingRect(with: CGSize(width: view.frame.width, height: 100000000000000000), options: [.usesFontLeading, .usesLineFragmentOrigin], context: nil)
tableView.tableHeaderView = headerView
let height = rect.height
headerView.frame = CGRect(x: 0, y: 0, width: self.view.width, height: height + headerView.frame.height)
}

Answer 1

Create an extension on NSAttributedString that calculates a height based on a given width:
extension NSAttributedString {
func height(forConstantWidth width: CGFloat) -> CGFloat {
let constraintBox = CGSize(width: width, height: .greatestFiniteMagnitude)
let calculatedBox = boundingRect(with: constraintBox, options: .usesLineFragmentOrigin, context: nil)
return calculatedBox.height
}
}
You could call that and pass in the table view's width, like:
let height = myAttrString.height(forConstantWidth: tableView.frame.size.width)

Answer 2

You can make UITableView's header resize to account for size of its Sub Elements.
You can use following extension.
extension UITableView {
func automaticHeaderViewSize() {
if let headerView = self.tableHeaderView {
let height = headerView.systemLayoutSizeFitting(UILayoutFittingCompressedSize).height
var headerFrame = headerView.frame
//Comparison necessary to avoid infinite loop
if height != headerFrame.size.height {
headerFrame.size.height = height
headerView.frame = headerFrame
self.tableHeaderView = headerView
}
}
}
}
Just make sure, your label has numberOfLines = 0.
So, finally your code is going to be (according to your question).
func setupTableHeader () {
let str = "your long text..."
let attributedStr = NSAttributedString(string: str)
headerViewLabel.attributedText = attributedStr
tableView.tableHeaderView = headerView
tableView.automaticHeaderViewSize()
}