Changing the title and the description below the collectionView cell When the collection view cell change. Doing this with index path is not working

Question

I am updating the title and the description with the index path that i get when i cahnge the collection view index, But this is not doing the right things because when i scroll to end and start scrolling back the description and title associated with each cell shows the unintended ones.

class IntroPage : BaseViewController {

@IBOutlet weak var titleLabel: UILabel!
@IBOutlet weak var descriptionLabel: UILabel!
@IBOutlet weak var pageController: UIPageControl!
@IBOutlet weak var button: UIButton!
@IBOutlet weak var collectionView: UICollectionView!

private let reuseIdentifier = "CollectionViewCellIntroScene"

    let collectionViewImages : [UIImage] = [
#imageLiteral(resourceName: "maskGroup30"), 
#imageLiteral(resourceName: "maskGroup34"), 
#imageLiteral(resourceName: "maskGroup33")
]

let collectionViewTitleTexts : [String] = [
    "Track Your Fitness",
    "Win Exciting Deals",
    "Be a Challenge Winner!"
]

override func viewDidLoad() {
    super.viewDidLoad()
    collectionView.register(UINib(nibName: "CollectionViewCellIntroScene", bundle: nil), forCellWithReuseIdentifier: reuseIdentifier)
    renderCells()
}

func renderCells() {
    collectionView.isPagingEnabled = true
    collectionView.isScrollEnabled = true
    collectionView.showsVerticalScrollIndicator = false
    collectionView.showsHorizontalScrollIndicator = false
    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
    layout.scrollDirection = .horizontal
    layout.minimumInteritemSpacing = 0
    layout.minimumLineSpacing = 0
    layout.sectionInset = UIEdgeInsets.zero
    collectionView.setCollectionViewLayout(layout, animated: true)
    collectionView.dataSource = self
    collectionView.delegate = self

}

}

Delegate for the Collection View

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

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

Data Source for Collection View

extension IntroPage : UICollectionViewDataSource {

func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {

    pageController?.currentPage = Int(scrollView.contentOffset.x) / Int(scrollView.frame.width)
}

func scrollViewDidEndScrollingAnimation(_ scrollView: UIScrollView) {

    pageController?.currentPage = Int(scrollView.contentOffset.x) / Int(scrollView.frame.width)
}

Here when i scroll forward and then backward the title and description shows the wrong outputs

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath) as! CollectionViewCellIntroScene

    cell.image.image = collectionViewImages[indexPath.item]
    titleLabel.text = collectionViewTitleTexts[indexPath.item]
    
    return cell
}
}

Hi, did you fix this issue? – Prashant Gaikwad May 11 '22 at 16:51 — Prashant Gaikwad, May 11 '22 at 16:51

Frankenstein · Accepted Answer · 2020-06-29T07:50:40.997

1

You seem to be using a common titleLabel and descriptionLabel and setting the title and description in cellForItemAt, which is called when the cell is loaded. Move the following from IntroPage to your cell CollectionViewCellIntroScene (modify the xib by adding the title and desc labels):

@IBOutlet weak var titleLabel: UILabel!
@IBOutlet weak var descriptionLabel: UILabel!

and in cellForRowAt:

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath) as! CollectionViewCellIntroScene
    cell.image.image = collectionViewImages[indexPath.item]
    cell.titleLabel.text = collectionViewTitleTexts[indexPath.item]
    return cell
}

edited Jun 29 '20 at 07:50

answered Jun 29 '20 at 07:21

Frankenstein

15,732
4
22
47

I tried it and yet it didnt work, Knowing that the index of the page controller is correct. When i print in the cellForItemAt the index path this is what i get , at app start --> 0 when i scroll to the next cell it prints 1 and 2 together and when i go to the third cell it prints nothing , when going back am at third cell going to second it prints 0 then when i reach first cell it prints nothing – Mahmoud Zinji Jun 29 '20 at 07:30
That's fine. It's loading the upcoming cell too. That's not your issue. No need to dig in that direction. – Frankenstein Jun 29 '20 at 07:35
humm, okay but how can i fix this any idea !? i was just trying to give nore details :) – Mahmoud Zinji Jun 29 '20 at 07:38
Are you having the issue with the title and description alone? Is it showing the right image? – Frankenstein Jun 29 '20 at 07:40
Yes the image is loading correctly, the title is not, knowing that i did not implement the code of the description yet. – Mahmoud Zinji Jun 29 '20 at 07:43
But my XIB cell is designed to hold only the Image, do i need to redesign it in a way that i will hold image + title + desc ? – Mahmoud Zinji Jun 29 '20 at 07:48
Yes exactly. I thought it was clear from the above answer. I've added a note in case it wasn't clear enough. – Frankenstein Jun 29 '20 at 07:48

score 1 · Answer 2 · answered Jun 29 '20 at 07:24

1

The problem is that you have to clean your cells while scrolling Create separate class for your Cell and use there method prepareForReuse to clean your cells

override func prepareForReuse() {
    super.prepareForReuse()
    yourLabel.text = ""
}

answered Jun 29 '20 at 07:24

Maksim Chizhavko

137
5

But my cell only holds the image the other labels are not in the XIB file, my XIB file only holds the image and others are in storyboard – Mahmoud Zinji Jun 29 '20 at 07:33

Changing the title and the description below the collectionView cell When the collection view cell change. Doing this with index path is not working

2 Answers2