multiple cells selected on scrolling [reuse cells problem] - ios

Question

I have a collectionViewCell which contains an image and a label. When I select a cell and scroll ahead I find other cell being selected. Also when I scroll back I find the other cell and not the cell I selected is selected.
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return followedUsers.count
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = attachProfilesCollectionView.dequeueReusableCell(withReuseIdentifier: "attachCells", for: indexPath) as? attachUsersCell
cell!.subscribedUserId = self.followedUsers[indexPath.row].userId
cell?.profileNameToAttah.text = self.followedUsers[indexPath.row].fullName
cell?.profileImageToAttch.loadImagesWithUrl(from: self.followedUsers[indexPath.row].ImagePath)
if mLastSelectedIndex == indexPath.row {
cell?.isSelected = true}
else{cell?.isSelected = false}
return cell!
}
func numberOfSections(in collectionView: UICollectionView) -> Int {
return 1
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
return CGSize(width: 80, height: 110)
}
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
let cell = attachProfilesCollectionView.cellForItem(at: indexPath) as! attachUsersCell
cell.subscribedUserId = following[indexPath.item]
usersToAttach.append(cell.subscribedUserId)
attachedCounter += 1
attachCounterFun()
print(usersToAttach)
cell.checkMarkImage.isHidden = false
attachCounterFun()
guard mLastSelectedIndex != indexPath.row else{return}
mLastSelectedIndex = indexPath.row
print("this is addition \(usersToAttach)")
}
func collectionView(_ collectionView: UICollectionView, didDeselectItemAt indexPath: IndexPath) {
let cell_ = attachProfilesCollectionView.cellForItem(at: indexPath) as! attachUsersCell
let toRemove = usersToAttach.index(of: following[indexPath.row])
usersToAttach.remove(at: toRemove!)
attachedCounter -= 1
attachCounterFun()
print(usersToAttach)
cell_.checkMarkImage.isHidden = true
print("this is removal \(usersToAttach)")
}
func collectionView(_ collectionView: UICollectionView, willDisplay cell: UICollectionViewCell, forItemAt indexPath: IndexPath) {
if isSelected {
cell.isSelected = true}
else { isSelected = false }
}
At present I have enabled paging and almost there but occasionally the selected cells change selection upon scroll

Answer 1

Maintain global variable in your controller
var mLastSelectedIndex = -1
Whenever cellForRowAtIndexPath method called check if current cell is selected or not .If this is selected One update its UI. I suggest you to change selected cell UI on cell class only. This way you can easily manage cell tapping and helps you writing clean code.
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = attachProfilesCollectionView.dequeueReusableCell(withReuseIdentifier: "attachCells", for: indexPath) as? attachUsersCell
cell!.subscribedUserId = self.followedUsers[indexPath.row].userId
cell?.profileNameToAttah.text = self.followedUsers[indexPath.row].fullName
cell?.profileImageToAttch.loadImagesWithUrl(from: self.followedUsers[indexPath.row].ImagePath)
// here update selected index path
if mLastSelectedIndex == indexPath.row {
cell?.isSelected = true
}
else{
cell?.isSelected = false
}
return cell!
}
Update last selected index on cell tapped.
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
guard mLastSelectedIndex != IndexPath.row else{return}
let indexpath = IndexPath(row:mLastSelectedIndex, section: 0)
mColllectionView.cellForItem(at: indexpath)?.isSelected = !mColllectionView.cellForItem(at: indexpath)!.isSelected
mLastSelectedIndex = IndexPath.row
}
In your attachUsersCell.swift declare isSelected property of cell . The default value of this property is false, which indicates that the cell is not selected.
override var isSelected: Bool{
didSet{
if isSelected {
setSelectedUI()
}
else{
setUnSelectedUI()
}
}
}
func setSelectedUI(){
borderColor = UIColor.systemOrange
borderWidth = 2
cornerRadius = 8
clipsToBounds = true
}
func setUnSelectedUI(){
// reset to default ui
}
Hope this helps!