Changing cell background color in UICollectionView in Swift

Question

I am using horizontal collection view to scroll dates. Collection view contain 30 cells. If I select first cell, to indicate the selection, cell background color has been change to brown from default color red. Then, if I select another cell, selected cell color has changed to brown from red. But first cell BGColor remains the same (brown). How can i change to default color by clicking other cell?

       func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath 
   indexPath: NSIndexPath) -> UICollectionViewCell {

    var cell = collectionView.dequeueReusableCellWithReuseIdentifier("cell", 
   forIndexPath: indexPath) as myViewCell

    cell.date_label.text = arr_date[indexPath.item]

    }

        func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath 
       indexPath: NSIndexPath) {

        var cell = collectionView.cellForItemAtIndexPath(indexPath) as myViewCell

        if(cell.selected)
        {
            cell.backgroundColor = UIColor.brownColor()

        }
        else
        {
            cell.backgroundColor = UIColor.redColor()
        }

    }

Answer 1

You can use the function collectionView with the parameter didSelectItemAtIndexPath

func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath 
   indexPath: NSIndexPath) {

       let selectedCell:UICollectionViewCell = myCollectionView.cellForItemAtIndexPath(indexPath)!
       selectedCell.contentView.backgroundColor = UIColor(red: 102/256, green: 255/256, blue: 255/256, alpha: 0.66)
}

This creates a constant for the selected UICollectionViewCell, then you just change the background's color

---

And then for return to the original color when it is deselected, you must use the function collectionView with the parameter didDeselectItemAtIndexPath

func collectionView(collectionView: UICollectionView, didDeselectItemAtIndexPath indexPath: NSIndexPath) {
        let cellToDeselect:UICollectionViewCell = myCollectionView.cellForItemAtIndexPath(indexPath)!
        cellToDeselect.contentView.backgroundColor = UIColor.clearColor()
}

And you change the color to the original one!

---

For example here is the screenshot from this code in a filterApp

UICollectionView example

Answer 2

var selectedIndex = Int ()

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

    if selectedIndex == indexPath.row
    {
        cell.backgroundColor = UIColor.green
    }
    else
    {
        cell.backgroundColor = UIColor.red
    }

    return cell
}

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath)
{
    selectedIndex = indexPath.row

    self.yourCollctionView.reloadData()
}

May be crazy, But it works fine for me...!

Answer 3

You could maintain a copy of the last selected index path, and then in your didSelectItemAtIndexPath compare the index paths to see if they are different. If different, change the colors of the two cells at those index paths as necessary and then copy the new index path over the old.

---

Edit

Thinking about this again, this should be done with the backgroundView and selectedBackgroundView properties of the cells. After you dequeue a cell you can do the following to let iOS handle the changing.

cell.backgroundView.backgroundColor = [UIColor redColor];
cell.selectedBackgroundView.backgroundColor = [UIColor brownColor];

Answer 4

Best way to handle background colour on selected cell is observing the property isSelected. This handles both selection and un-selection of a cell otherwise it would be tricky to un-select a selected cell at selection of any other cell. Here is the demonstration of using isSelected property of UICollectionViewCell:

class CustomCollectionViewCell: UICollectionViewCell {
    override var isSelected: Bool {
        didSet {
            contentView.backgroundColor = isSelected ? .red : .white
        }
    }
}