动态表视图单元格高度和自动布局

解决故事板自动布局问题的好方法：

- (CGFloat)heightForImageCellAtIndexPath:(NSIndexPath *)indexPath {
  static RWImageCell *sizingCell = nil;
  static dispatch_once_t onceToken;
  dispatch_once(&onceToken, ^{
    sizingCell = [self.tableView dequeueReusableCellWithIdentifier:RWImageCellIdentifier];
  });

  [sizingCell setNeedsLayout];
  [sizingCell layoutIfNeeded];

  CGSize size = [sizingCell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize];
  return size.height;
}

像@Bob Spryn一样，我遇到了一个非常重要的问题，我把这个问题作为答案发布。

我纠结于@smileyborg的回答了一会儿。我遇到的问题是，如果您在IB中使用其他元素（UILabels、UIButtons等）定义了原型单元，当您使用[[YourTableViewCellClass alloc]init]实例化该单元时，它不会实例化该单元中的所有其他元素，除非您编写了这样做的代码。（我对initWithStyle有过类似的经历。）

要让故事板实例化所有其他元素，请使用[tableView dequeueReusableCellWithIdentifier:@“DoseNeed”]（不是[tableView de queueReusable CellWithIdentifier:forIndexPath:]，因为这会引起有趣的问题。）执行此操作时，将实例化IB中定义的所有元素。

可变高度UITableViewCell的快速示例

为Swift 3更新

胡威廉（William Hu）的快速回答很好，但在我第一次学习做某事时，它能帮助我掌握一些简单而详细的步骤。下面的示例是我在学习使用可变单元格高度制作UITableView时的测试项目。我基于Swift的这个基本UITableView示例。

完成的项目应如下所示：

创建新项目

它可以只是一个单视图应用程序。

添加代码

将新的Swift文件添加到项目中。将其命名为MyCustomCell。此类将保存添加到情节提要中单元格的视图的出口。在这个基本示例中，每个单元格中只有一个标签。

import UIKit
class MyCustomCell: UITableViewCell {
    @IBOutlet weak var myCellLabel: UILabel!
}

我们稍后将连接此插座。

打开ViewController.swift并确保您具有以下内容：

import UIKit
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    // These strings will be the data for the table view cells
    let animals: [String] = [
        "Ten horses:  horse horse horse horse horse horse horse horse horse horse ",
        "Three cows:  cow, cow, cow",
        "One camel:  camel",
        "Ninety-nine sheep:  sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep baaaa sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep sheep",
        "Thirty goats:  goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat goat "]

    // Don't forget to enter this in IB also
    let cellReuseIdentifier = "cell"

    @IBOutlet var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // delegate and data source
        tableView.delegate = self
        tableView.dataSource = self

        // Along with auto layout, these are the keys for enabling variable cell height
        tableView.estimatedRowHeight = 44.0
        tableView.rowHeight = UITableViewAutomaticDimension
    }

    // number of rows in table view
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.animals.count
    }

    // create a cell for each table view row
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cell:MyCustomCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as! MyCustomCell
        cell.myCellLabel.text = self.animals[indexPath.row]
        return cell
    }

    // method to run when table view cell is tapped
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        print("You tapped cell number \(indexPath.row).")
    }
}

重要说明：

以下两行代码（以及自动布局）使可变单元格高度成为可能：tableView.estimatedRowHeight=44.0tableView.rowHeight=UITableViewAutomaticDimension

设置情节提要

将表视图添加到视图控制器中，并使用自动布局将其固定到四边。然后将表视图单元格拖到表视图上。然后将标签拖到原型单元格上。使用自动布局将标签固定到表视图单元的内容视图的四个边缘。

重要说明：

自动布局与我上面提到的两行重要代码一起工作。如果不使用自动布局，它将无法工作。

其他IB设置

自定义类名和标识符

选择TableViewCell并将自定义类设置为MyCustomCell（我们添加的Swift文件中的类名称）。还将Identifier设置为cell（与上面代码中用于cellReuseIdentifier的字符串相同）。

标签的零行

将标签中的行数设置为0。这意味着多行，并允许标签根据其内容调整自身大小。

连接插座

控件从情节提要中的表视图拖动到ViewController代码中的tableView变量。对Prototype单元格中的Label和MyCustomCell类中的myCellLabel变量执行同样的操作。

完成了

您现在应该能够运行项目并获得高度可变的单元格。

笔记

此示例仅适用于iOS 8及更高版本。如果您仍然需要支持iOS 7，那么这将不适用于您。未来项目中您自己的自定义单元格可能不止一个标签。确保将所有内容固定正确，以便自动布局可以确定要使用的正确高度。你可能还需要使用垂直抗压和拥抱。有关这方面的更多信息，请参阅本文。如果不固定前缘和后缘（左侧和右侧），则可能还需要设置标签的preferredMaxLayoutWidth，以便它知道何时换行。例如，如果在上面的项目中向标签添加了“水平居中”约束，而不是固定前缘和后缘，则需要将此行添加到tableView:cellForRowAtIndexPath方法：cell.myCellLabel.referencedMaxLayoutWidth=表格视图边界宽度

另请参见

了解iOS 8中的自调整单元格和动态类型具有不同行高的表视图单元格Swift的UITableView示例

（对于底部读取的Xcode 8.x/Xcode 9.x）

注意Xcode 7.x中的以下问题，这可能是混淆的根源：

Interface Builder无法正确处理自动调整单元格大小的设置。即使你的约束绝对有效，IB仍然会抱怨，并给你令人困惑的建议和错误。原因是IB不愿意根据您的约束条件改变行的高度（以便单元格适合您的内容）。相反，它会保持行的高度不变，并开始建议您更改约束，您应该忽略这些约束。

例如，假设您已经设置好了一切，没有警告，没有错误，一切正常。

现在，如果您更改字体大小（在本例中，我将描述标签的字体大小从17.0更改为18.0）。

由于字体大小增加，标签现在希望占据3行（之前它占据2行）。

如果Interface Builder按预期工作，它将调整单元格的高度以适应新的标签高度。然而，实际发生的情况是IB显示红色的自动布局错误图标，并建议您修改拥抱/压缩优先级。

您应该忽略这些警告。相反，您可以*手动更改行的高度（选择“单元格”>“大小检查器”>“行高度”）。

我一次单击一次（使用上/下步进器）改变这个高度，直到红色箭头错误消失！（实际上，您会收到黄色警告，此时只需继续并执行“更新帧”，一切都应该正常）。

*请注意，您实际上不必在Interface Builder中解决这些红色错误或黄色警告-在运行时，一切都会正常工作（即使IB显示错误/警告）。只需确保在运行时控制台日志中没有出现任何自动布局错误。事实上，尝试总是更新IB中的行高度是非常令人讨厌的，有时几乎不可能（因为分数值）。为了防止烦人的IB警告/错误，您可以选择所涉及的视图，并在Size Inspector中为属性Ambiguity选择Verify Position Only

---

Xcode 8.x/Xcode 9.x看起来（有时）做的事情与Xcode 7.x不同，但仍然不正确。例如，即使抗压优先级/拥抱优先级设置为必需（1000），Interface Builder也可能拉伸或剪裁标签以适合单元格（而不是调整单元格高度以适合标签周围）。在这种情况下，它甚至可能不会显示任何自动布局警告或错误。或者，有时它完全像上面描述的Xcode7.x那样。

另一个“解决方案”：跳过所有这些挫折，改用UIScrollView来获得与UITableView看起来和感觉相同的结果。

对我来说，这是一个痛苦的“解决方案”，因为我花了20多个令人沮丧的小时试图构建类似smileyborg建议的东西，但在几个月和三个版本的应用商店发布中失败了。

我的看法是，如果你真的需要iOS 7支持（对我们来说，这是必不可少的），那么这项技术太脆弱了，你会竭尽全力。UITableView通常是完全过度的，除非您使用一些高级行编辑功能和/或确实需要支持1000+“行”（在我们的应用程序中，它实际上永远不会超过20行）。

额外的好处是，与UITableView附带的所有委托垃圾相比，代码变得异常简单。它只是viewOnLoad中的一个代码循环，看起来很优雅，易于管理。

以下是一些关于如何做到这一点的提示：

使用Storyboard或nib文件，创建ViewController和关联的根视图。将UIScrollView拖到根视图上。向顶层视图添加顶部、底部、左侧和右侧约束，以便UIScrollView填充整个根视图。在UIScrollView中添加一个UIView，并将其称为“容器”。向UIScrollView（其父视图）添加顶部、底部、左侧和右侧约束。关键技巧：还要添加一个“等宽”约束来链接UIScrollView和UIView。注意：您将收到一个错误“滚动视图的可滚动内容高度不明确”，并且您的容器UIView的高度应该为0像素。当应用程序运行时，这两个错误似乎都不重要。为每个“单元”创建笔尖文件和控制器。使用UIView而不是UITableViewCell。在您的根ViewController中，您实际上将所有“行”添加到容器UIView中，并以编程方式添加约束，将它们的左边缘和右边缘链接到容器视图，将其顶部边缘链接到（第一个项目的）容器视图顶部或上一个单元格。然后将最终单元格链接到容器底部。

对我们来说，每一行都在一个笔尖文件中。所以代码看起来像这样：

class YourRootViewController {

    @IBOutlet var container: UIView! //container mentioned in step 4

    override func viewDidLoad() {
        
        super.viewDidLoad()

        var lastView: UIView?
        for data in yourDataSource {

            var cell = YourCellController(nibName: "YourCellNibName", bundle: nil)
            UITools.addViewToTop(container, child: cell.view, sibling: lastView)
            lastView = cell.view
            //Insert code here to populate your cell
        }

        if(lastView != nil) {
            container.addConstraint(NSLayoutConstraint(
                item: lastView!,
                attribute: NSLayoutAttribute.Bottom,
                relatedBy: NSLayoutRelation.Equal,
                toItem: container,
                attribute: NSLayoutAttribute.Bottom,
                multiplier: 1,
                constant: 0))
        }

        ///Add a refresh control, if you want - it seems to work fine in our app:
        var refreshControl = UIRefreshControl()
        container.addSubview(refreshControl!)
    }
}

下面是UITools.addViewToTop的代码：

class UITools {
    ///Add child to container, full width of the container and directly under sibling (or container if sibling nil):
    class func addViewToTop(container: UIView, child: UIView, sibling: UIView? = nil)
    {
        child.setTranslatesAutoresizingMaskIntoConstraints(false)
        container.addSubview(child)
        
        //Set left and right constraints so fills full horz width:
        
        container.addConstraint(NSLayoutConstraint(
            item: child,
            attribute: NSLayoutAttribute.Leading,
            relatedBy: NSLayoutRelation.Equal,
            toItem: container,
            attribute: NSLayoutAttribute.Left,
            multiplier: 1,
            constant: 0))
        
        container.addConstraint(NSLayoutConstraint(
            item: child,
            attribute: NSLayoutAttribute.Trailing,
            relatedBy: NSLayoutRelation.Equal,
            toItem: container,
            attribute: NSLayoutAttribute.Right,
            multiplier: 1,
            constant: 0))
        
        //Set vertical position from last item (or for first, from the superview):
        container.addConstraint(NSLayoutConstraint(
            item: child,
            attribute: NSLayoutAttribute.Top,
            relatedBy: NSLayoutRelation.Equal,
            toItem: sibling == nil ? container : sibling,
            attribute: sibling == nil ? NSLayoutAttribute.Top : NSLayoutAttribute.Bottom,
            multiplier: 1,
            constant: 0))
    }
}

到目前为止，我用这种方法发现的唯一“错误”是UITableView具有一个很好的特性，即在滚动时在视图顶部“浮动”节标题。除非您添加更多的编程，否则上面的解决方案无法做到这一点，但对于我们的特定情况，这一功能并不是100%必需的，当它消失时，没有人注意到。

如果您希望在单元格之间使用分隔符，只需在自定义“单元格”底部添加一个1像素高的UIView，它看起来像分隔符。

确保启用“反弹”和“垂直反弹”，刷新控件才能工作，这样看起来更像是一个表视图。

TableView在您的内容下显示一些空行和分隔符，如果它没有像这个解决方案那样填满整个屏幕。但就我个人而言，我更希望那些空行不在那里——因为单元格高度可变，所以我总是觉得空行在那里很“麻烦”。

希望其他一些程序员在浪费20多个小时试图在自己的应用程序中使用表视图解决问题之前阅读我的帖子

我只是对rowHeight和estimatedRowHeight的两个值进行了一些愚蠢的尝试和错误，并认为它可能会提供一些调试细节：

如果同时设置它们，或者仅设置估计的RowHeight，则将获得所需的行为：

tableView.rowHeight = UITableViewAutomaticDimension
tableView.estimatedRowHeight = 1.00001 // MUST be greater than 1

建议您尽最大努力得到正确的估计，但最终结果并无不同。这只会影响你的表现。

---

如果只设置rowHeight，即只执行以下操作：

tableView.rowHeight = UITableViewAutomaticDimension

您的最终结果不会如预期：

---

如果将estimatedRowHeight设置为1或更小，则无论rowHeight如何，都会崩溃。

tableView.rowHeight = UITableViewAutomaticDimension
tableView.estimatedRowHeight = 1 

我崩溃了，出现以下错误消息：

Terminating app due to uncaught exception
'NSInternalInconsistencyException', reason: 'table view row height
must not be negative - provided height for index path (<NSIndexPath:
0xc000000000000016> {length = 2, path = 0 - 0}) is -1.000000'
    ...some other lines...

libc++abi.dylib: terminating with uncaught exception of type
NSException