CollectionView 单元格大小以适合标签答案

【问题标题】：CollectionView Cell size to fit LabelCollectionView 单元格大小以适合标签
【发布时间】：2017-11-19 22:37:34
【问题描述】：

我设置了一个集合视图，使用它水平滚动并显示“公司”数组中的元素。

单元格会根据标签宽度自动调整大小。

我使用下面的代码和故事板约束来实现这一点：

class addTextStatus: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource {

    var companies: [String] = ["Everyone","Limited", "Friends", "Only Me", "Test Length Cells", ]

    @IBOutlet weak var collectionView: UICollectionView!
    @IBOutlet weak var userImage: UIImageView!
    override func viewDidLoad(){

              collectionView.register(UINib.init(nibName: "statusCompanyCollectionView", bundle: nil), forCellWithReuseIdentifier: "cell4")

        if let flowLayout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
            flowLayout.estimatedItemSize = CGSize(width: 1,height: 1)

        }

        userImage.layer.masksToBounds = false
        userImage.layer.cornerRadius = userImage.frame.height/2
        userImage.clipsToBounds = true
    }
    @IBOutlet weak var backButton: UIButton!
    @IBAction func backButton(_ sender: Any) {

       dismiss(animated: true, completion: nil)

    }

    override var preferredStatusBarStyle : UIStatusBarStyle {
        return UIStatusBarStyle.default  
    }

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return self.companies.count
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {


        let cell4 = collectionView.dequeueReusableCell(withReuseIdentifier: "cell4", for: indexPath) as! statusCompanyCollectionView

        cell4.company.text = self.companies[indexPath.item]

        return cell4
    }

    }

但问题是，当我在标签后面添加 UIImage 视图并分配约束以指示它应该与标签的大小和位置相同时，我会得到以下意外结果：

实际上我想实现以下目标：

我用来应用后面的图像的约束如下：

有趣的是，当我使用 UIView 而不是 UIImage 视图时，它可以按预期工作，但是我确实需要在这种情况下使用图像视图。

为什么会发生这种情况，我该如何解决这个问题？

【问题讨论】：

对我来说，其中一个问题可能在于内容拥抱和内容抗压优先级不正确为标签配置。附带说明一下，考虑使用UIStackView，我发现在堆叠视图时使用它更容易进行自动布局。

标签： swift xcode uicollectionview uicollectionviewlayout

【解决方案1】：

标签具有固有大小。图像视图具有固有大小。

当您将标签和图像视图的宽度相等时，自动布局无法决定哪个应该更改大小以满足约束。

您需要通过降低图像视图的 Content Hugging 和 Content Compression Resistance 优先级来消除歧义。

例如，您最终可能会得到标签 CH=251、CCR=750 和图像视图 CH=240、CCR=740。

然后，在自动布局期间，标签的固有尺寸将胜出，图像视图将采用标签的尺寸。

普通视图没有固有大小，因此当您尝试该选项时不会有歧义（默认情况下标签获胜）。如果您试图使两个标签的宽度相等，您会看到同样的歧义。

【讨论】：

嗨，我只想说谢谢你不仅提供了一个可行的解决方案，而且还提供了清晰简洁的解释：）非常感谢！

【解决方案2】：

删除水平居中和垂直居中约束。
添加从 UIImageView 到 UILabel 的前导和尾随约束。

您只需将四个约束 (Leading,Trailing,Equalwidth,EqualHeight) 从 UIImageView 添加到 UILabel。

【讨论】：