ios - UICollectionView 在单元格外渲染图像

Question

我有一个显示 2 个单元格的 UICollectionView。每个单元格中都有一个 UIImageView。当显示单元格时，第一个单元格是正确的，但第二个单元格中的 ImageView 正在显示，就好像它在第三个单元格中一样。

代码:

var upgradeCollectionView: UICollectionView!

lazy var upgradeView: UIView = {

    ... //Add other views

    let layout = UICollectionViewFlowLayout()
    layout.sectionInset = UIEdgeInsets(top: 0, left: 1, bottom: 0, right: 1)
    layout.minimumInteritemSpacing = 0
    layout.minimumLineSpacing = 1
    let itemSideSize = (self.view.frame.width - 5) / 4
    layout.itemSize = CGSize(width: itemSideSize, height: itemSideSize)
    self.upgradeCollectionView = UICollectionView(frame: CGRect(x: 0, y: 44, width: newView.frame.width, height: newView.frame.height), collectionViewLayout: layout)
    newView.addSubview(self.upgradeCollectionView)
    self.upgradeCollectionView.register(CollUpgradeCell.self, forCellWithReuseIdentifier: "CollUpgradeCell")
    self.upgradeCollectionView.delegate = self
    self.upgradeCollectionView.dataSource = self
    self.upgradeCollectionView.isHidden = true
    self.upgradeCollectionView.contentInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
}        

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    availableUpgrades = []
    upgrades.forEach { (upgrade) in
        if upgrade.isHidden == false{
            if upgrade.owned == false{
                availableUpgrades.append(upgrade)
            }
        }
    }

    availableUpgrades = availableUpgrades.sorted(by: { $0.cost < $1.cost })

    return availableUpgrades.count //Returns 2
}


func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CollUpgradeCell", for: indexPath) as! CollUpgradeCell
    cell.resetCell() //Resets BG color, text label, and imageview.image = nil

    let upgrade = availableUpgrades[indexPath.item]

    cell.textLabel.text = String(upgrade.cost)
    cell.imageView.image = upgrade.image
    cell.backgroundColor = .green

    return cell
}

class CollUpgradeCell: UICollectionViewCell {

     var imageView = UIImageView()
     var textLabel = UILabel(frame: CGRect(x: 30, y: 30, width: 50, height: 500))

    override init(frame: CGRect) {
        super.init(frame: frame)
        addSubview(textLabel)
        addSubview(imageView)
        imageView.frame = frame
    }
}

Answer 1

这是您的问题，您需要将 CollectionViewCell 的边界用作 UIImageView 的框架

override init(frame: CGRect) {
        super.init(frame: frame)
        addSubview(textLabel)
        addSubview(imageView)
        //imageView.frame = frame  this is your problem source
        imageView.frame = self.bounds
    }

希望对你有帮助