Search code examples
iosswiftautolayoutuicollectionviewcell

Multiline label in collection view cell breaks after reuse

I have a custom UICollectionViewCell with several UI elements, laid out using AutoLayout setup in code.

On larger devices (iPhone 6 and up) everything works as expected.

On smaller devices however, a multiline UILabel breaks, but only (it seems) after reuse.

On initial display, the first cell looks like this:

Initial display of cell

After the cell has been scrolled off screen and brought back on again, it looks like this:

Second display of cell

These are the constraints set up on the label:

    descriptionLabel.centerXAnchor.constraint(equalTo: firstButton.centerXAnchor),
    descriptionLabel.leadingAnchor.constraint(equalTo: otherLabel.leadingAnchor),
    descriptionLabel.topAnchor.constraint(equalTo: firstButton.bottomAnchor, constant: 15),
    secondButton.topAnchor.constraint(greaterThanOrEqualTo: descriptionLabel.bottomAnchor, constant: 20),

I feel like it's something to do with the greaterThanOrEqualTo constraint, but if I replace that with a plain old equalTo constraint, the layout goes wild and the label shrinks down to only fit one line.

Solution

  • I've faced the similar problem in UICollectionView and I found solution in preferredMaxLayoutWidth property and widthAnchor

    productNameLabel.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 0.6)
productNameLabel.preferredMaxLayoutWidth = self.frame.size.width * 0.6

    it should fix the problem.