如何自动调整包含多行 UIButton 的 UITableViewCell 的高度？

Question

UITableViewCell 的子类包含带有多行文本的UIButton，即属性numberOfLines = 0。

表格视图单元格的高度不同，因此单元格高度设置为UITableViewAutomaticDimension。

当添加带有多个文本行的UILabel 时，单元格高度会调整。但是它不适应UIButton，实际上按钮的框架也不适应其titleLabel的框架。

如何使表格视图单元格及其内容视图适应按钮高度？

class MyButtonCell: UITableViewCell {

    var button: UIButton!
    var buttonText: String?

    convenience init(buttonText: String?) {
        self.init()

        self.buttonText = buttonText

        button = UIButton(type: UIButtonType.System)
        button.titleLabel?.numberOfLines = 0
        button.titleLabel?.lineBreakMode = .ByWordWrapping
        button.contentHorizontalAlignment = .Center
        button.titleLabel?.textAlignment = .Center

        button.translatesAutoresizingMaskIntoConstraints = false
        contentView.addSubView(button)

        NSLayoutConstraint.activateConstraints([
            button.topAnchor.constraintEqualToAnchor(self.contentView.topAnchor),
            button.bottomAnchor.constraintEqualToAnchor(self.contentView.bottomAnchor),
            button.rightAnchor.constraintEqualToAnchor(self.contentView.rightAnchor),
            button.leftAnchor.constraintEqualToAnchor(self.contentView.leftAnchor)
            ])

        button.setTitle(buttonText, forState: .Normal)
        button.setTitleColor(buttonTextColor, forState: UIControlState.Normal)
        button.titleLabel?.font = buttonFont
    }
}

单元格高度通过以下方式自动计算：

tableView.estimatedRowHeight = 100

func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
    return UITableViewAutomaticDimension
}

更新：

https://github.com/mtrezza/ButtonCellHeightBug上的示例项目

已提交 Apple 错误报告 #26170971。

该错误导致：

Answer 1

表格视图单元格的完全动态高度可通过以下方式实现：1）使用估计的行高，2）将 rowHeight 设置为 AutoDimension，3）最重要的是使用 xib/storyboard 中的约束。单元格可以包含按钮/标签或您想要的任何 UI 组件，只要您正确地约束它们，特别是要确保事物受到垂直约束，以便表格视图可以计算单元格高度。而且这样你就不用计算动态文本的高度，不需要sizeToFit/sizeThatFit，它适用于不同的屏幕尺寸。

Answer 2

您应该使用estimatedHeightForRowAtIndexPath。在您的按钮上，您可以调用sizeToFit()，它将调整其大小以包含文本。

另外，如果您在 tableView 上设置估计大小（如您所做的那样），您通常不需要调用 heightForRowAtIndexPath 或 estimatedHeightForRowAtIndexPath，tableView 会为您设置。

编辑：

我创建了一个测试项目，您似乎是正确的。使用 UIButton setTitle 不会调整单元格的大小。

一种解决方法是使用heightForRowAtIndexPath 中的标签进行计算，然后返回该值+任何填充。然后在cellForRowAtIndexPath中，你仍然可以在按钮上设置标题，它就会出现。

//paragraphs is just a string array.
override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
        let label = UILabel(frame: CGRectMake(0,0,tableView.frame.width, <your prototype height>))
        label.numberOfLines = 0
        label.text = paragraphs[indexPath.row]
        label.sizeToFit()
        print(label.frame.height)
        return label.frame.height
    }

iOS 中的错误？

Answer 3

问题是内部UIButtonLabel 正确调整大小，但实际UIButton 没有。

我通过扩展 UIButton 并覆盖了一些东西来解决这个问题：

override func layoutSubviews() {
    super.layoutSubviews()
    self.titleLabel?.preferredMaxLayoutWidth = self.titleLabel?.frame.size.width ?? 0
}

override var intrinsicContentSize: CGSize {
    return self.titleLabel?.intrinsicContentSize ?? CGSize.zero
}

您还需要确保titleLabel?.numberOfLines = 0 和titleLabel?.lineBreakMode = .byWordWrapping。