具有自动布局和UITableAutomaticDimension的动态高度表单元格（动态UILabel +多个UIImageViews）

Question

我浏览了与动态表格单元格和自动布局相关的文章3天，到目前为止还没有工作。

下面是表格单元格我想要的。 在这里，主要问题是用于发布文本和UIImage的UILabel。

这是UI元素的层次结构。

- Content View
    + ...
    + UILabel for text - dynamic height
    + UIView - image view container
        * UIImageView
        * UIImageView
        * ....

标签的换行模式换行文本和行设置为0。标签和容器视图具有顶部，底部，前导和尾随约束。 ImageViews是在运行时添加的，并且具有顶部，顶部，尾部，底部和高度约束。 第一个图像视图对容器视图具有顶部约束，最后一个图像视图对容器视图具有底部约束，而其他图像视图对上部图像视图具有顶部约束。

第一次加载表（单元格具有不同的图像计数）时，它看起来不错，但是当我上下滚动时，某些单元格中的约束已破裂，单元格中的图像重叠。

这是错误输出：

Unable to simultaneously satisfy constraints.   Probably at least one of the constraints in the following list is one you don't want.      
Try this:       
(1) look at each constraint and try to figure out which you don't expect;       
(2) find the code that added the unwanted constraint or constraints and fix it.

"<NSLayoutConstraint:0x17428aaf0 V:|-(0)-[UIImageView:0x14be77ed0]   (active, names: '|':UIView:0x14be75b20 )>",
"<NSLayoutConstraint:0x17428a6e0 UIImageView:0x14be77ed0.height == 160   (active)>",
"<NSLayoutConstraint:0x17428acd0 UIImageView:0x14be77ed0.bottom == UIView:0x14be75b20.bottom   (active)>",
"<NSLayoutConstraint:0x174289650 V:|-(0)-[UIImageView:0x14be43ce0]   (active, names: '|':UIView:0x14be75b20 )>",
"<NSLayoutConstraint:0x17428bb80 UIImageView:0x14be43ce0.height == 160   (active)>",
"<NSLayoutConstraint:0x17428be50 V:[UIImageView:0x14be43ce0]-(10)-[UIImageView:0x14be74b10]   (active)>",

"<NSLayoutConstraint:0x17428bfe0 UIImageView:0x14be74b10.height == 160   (active)>",
"<NSLayoutConstraint:0x17428c080 UIImageView:0x14be74b10.bottom == UIView:0x14be75b20.bottom   (active)>"

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x17428be50 V:[UIImageView:0x14be43ce0]-(10)-[UIImageView:0x14be74b10]   (active)>

请帮我解决这个问题。 谢谢。

Answer 1

为了确保在单元出队时堆栈视图中不包含旧图像，您需要在prepareForReuse()对其进行清理：

override func prepareForReuse() {
    super.prepareForReuse()

    stack.arrangedSubviews.forEach {
        stack.removeArrangedSubview($0)
        $0.removeFromSuperview()
    }
}

Answer 2

我建议不要给图像增加高度，而是将垂直stackview添加到容器视图中，然后在其中添加所有图像。 确保将内容模式设置为适合方面，并且stackview应该照顾其余的内容。 不要忘记将stackview限制在标签的底部和单元格的底部，因此它知道它有多少空间。 它会自己照顾您的图像

Answer 3

ImageViews是在运行时添加的，并且具有顶部，顶部，尾部，底部和高度约束。

这是您的错误信息。 删除高度或您选择使用底部或顶部 contraint约束之一。 您不能同时限制所有4个面并为其添加高度常数。

边注：

宽度也一样，如果设置宽度约束，则不能同时限制前导/后沿的两侧。

编辑：

另外，按照注释部分的建议使用UIStackView可以更轻松。