CODEWITHSUNDEEP
iosswiftswift3uicollectionview
Ross Sullivan
Ross Sullivan

Reputation: 435

UICollectionView rendering image outside of cell

I have a UICollectionView with 2 cells being displayed. Each cell has a UIImageView in it. When the cells are displayed the first cell is correct but the ImageView in the second cell is being displayed as if it were in the third cell.

enter image description here Code: 

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
    }
}

Upvotes: 0

Views: 1201

Answers (1)

Reinier Melian
Reinier Melian

Reputation: 20804

Here is your problem, you need to use as frame of your UIImageView the bounds of your CollectionViewCell

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

Hope this helps

Upvotes: 2

Related Questions