使用以编程方式创建的 UICollectionView 时出现奇怪的绘图

Question

我正在以编程方式创建 UICollectionView 及其单元格。在我的自定义 UICollectionView 中，唯一实现的方法是 layoutSubviews。下面是用于设置我的集合视图和处理委托的代码。正如您从 gif 中看到的那样，偶尔会有一个单元格正确加载，但大多数单元格未对齐或超出屏幕。我怀疑它们的重用方式有问题。我通常使用 tableviews 和 scrollviews，所以我不太喜欢 collection views。我怎样才能解决这个问题？

let layout = UICollectionViewFlowLayout()
    layout.scrollDirection = .horizontal
    layout.minimumInteritemSpacing = 0
    layout.minimumLineSpacing = 0
    layout.itemSize = CGSize(width: 160, height: 200)
    featuredCollectionView = UICollectionView(frame: frame), collectionViewLayout: layout)

featuredCollectionView.delegate = self
    featuredCollectionView.dataSource = self
    featuredCollectionView.register(ItemCollectionViewCell.self, forCellWithReuseIdentifier:
    "cell")

// MARK: CollectionView Delegate 

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAt section: Int) -> CGFloat
{
    return 8
}

func numberOfSections(in collectionView: UICollectionView) -> Int
{
    return 1
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
{
    return CGSize(width: 160, height: featuredCollectionView.frame.size.height)
}

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

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! ItemCollectionViewCell
    cell.item = featuredItems[indexPath.row]

    return cell
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets
{
    return UIEdgeInsetsMake(0, 0, 0, 0)
}

Answer 1

要查看您的主要问题，请检查 backgroundCardView 的框架，您正在根据集合视图中单元格的原点对其进行设置。

backgroundCardView.frame = CGRect(x: self.frame.origin.x + 8, y: self.frame.origin.x + 8, width: self.frame.size.width - 16, height: self.frame.size.height - 16)

这将远远超出单元格的边界，这就是它看起来布局不正确的原因。此外，您应该将子视图添加到单元格的 contentView 而不是直接添加到它的视图。如其他评论所述，您不应在 layoutSubviews 中添加视图。更好的地方是在 init 方法中。

使用以编程方式创建的 UICollectionView 时出现奇怪的绘图

Weird drawing when using UICollectionView created programmatically

ios

uicollectionview

uicollectionviewcell