Table section header: multi-line/word wrapping

Question

I am trying to make a table in which the section headers can be long strings. I thought I had the settings right (dynamic number of lines, word wrapping set) but instead the string is simply truncated at the end. Note that the section header is sized with a height of 80, elsewhere, which is enough to display about 3 lines of text.

// Format section header
override func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {

    let header: UITableViewHeaderFooterView = view as! UITableViewHeaderFooterView
    header.contentView.backgroundColor = mainColorBlue
    header.textLabel.textColor = UIColor.whiteColor()

    header.textLabel.textAlignment = NSTextAlignment.Left
    header.textLabel.numberOfLines = 0 // Dynamic number of lines
    header.textLabel.lineBreakMode = NSLineBreakMode.ByWordWrapping
    header.textLabel.font = UIFont(name: "HelveticaNeue-Thin", size: 16)!
    header.textLabel.text = objectsArray[section].sectionName

}

Answer 1

You will have to create a custom headerView. This is what I did - Swift 3, you would have to customize it for your use:

override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
//Need to create a label with the text we want in order to figure out height
    let label: UILabel = createHeaderLabel(section)
    let size = label.sizeThatFits(CGSize(width: view.width, height: CGFloat.greatestFiniteMagnitude))
    let padding: CGFloat = 20.0
    return size.height + padding
}

override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let headerView = UITableViewHeaderFooterView()
    let label = createHeaderLabel(section)
    label.autoresizingMask = [.flexibleHeight]
    headerView.addSubview(label)
    return headerView
}

func createHeaderLabel(_ section: Int)->UILabel {
    let widthPadding: CGFloat = 20.0
    let label: UILabel = UILabel(frame: CGRect(x: widthPadding, y: 0, width: self.view.width - widthPadding, height: 0))
    label.text = sectionTextArray[section]// Your text here
    label.numberOfLines = 0;
    label.textAlignment = NSTextAlignment.left
    label.lineBreakMode = NSLineBreakMode.byWordWrapping
    label.font = UIFont.preferredFont(forTextStyle: UIFontTextStyle.subheadline) //use your own font here - this font is for accessibility 
    return label
}    

Answer 2

Specify Automatic height dimension -

func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return UITableViewAutomaticDimension
}

Answer 3

I do the opposite I set number of lines to a huge number and then Dynamic size works.

• In IB
• Dont set any WIDTH/HEIGHT constants
• only Leading Trailing/Top/Bottom around controls in TableViewCells

self.tableView.sectionHeaderHeight = UITableViewAutomaticDimension; self.tableView.estimatedSectionHeaderHeight = 25;

- (void)viewDidLoad
{
    [super viewDidLoad];

    //-----------------------------------------------------------------------------------
    //DYNAMIC TEXT and TABLE ROW HEIGHT
    //-----------------------------------------------------------------------------------
    self.tableView.estimatedRowHeight = 80.0f;
    //also done in heightForRowAtIndexPath
    self.tableView.rowHeight = UITableViewAutomaticDimension;

    self.tableView.sectionHeaderHeight = UITableViewAutomaticDimension;
    self.tableView.estimatedSectionHeaderHeight = 80.0f;

}
//comment out
//- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {

See also Is it possible to obtain a dynamic table view section header height using Auto Layout?