UICollectionViewCell 动态高度，带两个动态标签和自动布局 [英] UICollectionViewCell dynamic height w/two dynamic labels & auto layout

问题描述

我有一个 UICollectionViewCell 子类，它设置有原型单元格和约束(每个视图都垂直和水平连接).

I have a UICollectionViewCell subclass that's setup with a prototype cell and constraints (every view is connected both vertically and horizontally).

我有两个大小不同的标签，它们可以是一行或两行.为此，我在每个标签上设置了两个高度限制，一个大于或等于(16 或 20，取决于标签)和一个小于或等于(32 或 40，取决于标签).

I have two labels that can vary in size, they can be either one or two lines. To that end I have set two height constraints on each label, one with a greater than or equal (16 or 20 depending on the label) and a less than or equal (32 or 40 depending on the label).

标签上的行数设置为0.(虽然我尝试了各种设置).

The number of lines on the labels are set to 0. (Though I have tried a variety of settings).

由于我使用了自动布局和约束来设置视图，因此我在单元格的 awakeFromNib() 中的内容视图上指定了宽度

Since I've used auto layout and constraints to setup the view I've specified a width on the content view in the cell's awakeFromNib()

override func awakeFromNib() {
        NSLayoutConstraint.activate([contentView.widthAnchor.constraint(equalToConstant: 341)])
        super.awakeFromNib()
        configureBorder()
}

在 collectionView 的布局中，我已经为 estimateItemSize & 指定了 automaticDimension 常量.项目大小

On the collectionView's layout I've specified the automaticDimension constant for estimateItemSize & itemSize

if let flowLayout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
    flowLayout.estimatedItemSize = UICollectionViewFlowLayoutAutomaticSize
    flowLayout.itemSize = UICollectionViewFlowLayoutAutomaticSize
}

有了使用自动布局的想法，我没有在集合视图上实现了一个委托.

With the idea of using auto layout I have not implemented a delegate on the collection view.

我遇到了非常不一致的布局，在某些情况下单元格会按照我的意愿显示，在其他情况下标签被截断，在其他情况下标签非常窄并且显示超过三行的文本.

I am experiencing very inconsistent layout, some instances the cell's will appear as I'd like them to, in others the labels are truncated and in others the labels are extremely narrow and display text over three lines.

我尝试了很多事情，包括打电话<代码>.sizeToFit()在每个标签上设置它的文本属性后，以及调用<代码>.setNeedsDisplay()在单元格从 cellForItemAt

I have tried many things, including calling .sizeToFit() on each label after it's text property is set, as well as calling .setNeedsDisplay() before the cell returns from cellForItemAt

我想知道用情节提要约束来做到这一点的正确方法是什么.我在 SO 上处理过类似问题的一些流行答案，但没有取得任何真正的成功.

I'm wondering what is the right way to do this with storyboard constraints. I've worked with some of the popular answers to similar questions here on SO, though none to any real success.

推荐答案

flowLayout.estimatedItemSize = UICollectionViewFlowLayoutAutomaticSize
flowLayout.itemSize = UICollectionViewFlowLayoutAutomaticSize

当然，我熟悉 Apple 的反复声明，即 UICollectionViewFlowLayout 中的 UICollectionViewCell 可以根据内部约束自行调整大小.但我从未见过 Apple 的工作代码演示了此功能，而且我自己从来没有一次成功地证实了这些说法是正确的.我不相信真的有像自定尺寸单元这样的东西.多年来，试图让单元格自行调整大小导致了崩溃.在 iOS 10 中，崩溃基本上停止了，但现在流布局没有正确布置单元格(这听起来像您所看到的那样).

Of course I am familiar with Apple's repeated claims that a UICollectionViewCell in a UICollectionViewFlowLayout can be self-sizing based on internal constraints. But I have never seen working code from Apple that demonstrated this feature, and I have never once myself succeeded in confirming those claims to be true. I do not believe there is really such a thing as a self-sizing cell. For years, trying to get a cell to be self-sizing resulted in crashes. In iOS 10, the crashing mostly stopped, but now the flow layout was not laying out the cells correctly (which sounds like what you're seeing).

当然，我每年都在这方面提交错误.

Naturally, I have filed bugs on all this, year after year.

同时，我要做的是给集合视图一个委托并实现collectionView(_:layout:sizeForItemAt:)，我建议你也应该这样做.

Meanwhile, what I do is to give the collection view a delegate and implement collectionView(_:layout:sizeForItemAt:), and I suggest that you should do the same.

编辑 iOS 13 中的新功能，您可以使用可组合布局 并完全放弃 UICollectionViewFlowLayout.可自行调整大小的单元格在可组合布局中运行良好.

EDIT New in iOS 13 you can use a composable layout and abandon UICollectionViewFlowLayout altogether. Self-sizing cells work fine in a composable layout.

这篇关于UICollectionViewCell 动态高度，带两个动态标签和自动布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！