Change color of table view cell when clicked

I have a table view with ten entries, which refers to another view. If I click on one cell the color changes to light grey and shows the next page. I want to set this color to black when the table view cell is clicked. How can I do this?
Answered by Claude31 in 648968022
Create a var to keep the selected row

var selectedIndex = IndexPath(row: -1, section: 0)

In didSelectRowAt:

Code Block
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        let indexesToRedraw = [indexPath]
selectedIndex = indexPath
// Do what you need here
tableView.reloadRows(at: indexesToRedraw, with: .fade)
// go to next "page"
}


In cellForRowAt
Code Block
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "Some identifier", for: indexPath)
// Load the cell content
if selectedIndex == indexPath { cell.backgroundColor = UIColor.black }
return cell
}


Accepted Answer
Create a var to keep the selected row

var selectedIndex = IndexPath(row: -1, section: 0)

In didSelectRowAt:

Code Block
    override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        let indexesToRedraw = [indexPath]
selectedIndex = indexPath
// Do what you need here
tableView.reloadRows(at: indexesToRedraw, with: .fade)
// go to next "page"
}


In cellForRowAt
Code Block
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "Some identifier", for: indexPath)
// Load the cell content
if selectedIndex == indexPath { cell.backgroundColor = UIColor.black }
return cell
}


It helps a bit, but this way I change the Table View Cell Background "forever" to black, I just want to change it for one second, when it is clicked.
That is a workaround.

You could create an array of Bool to keep the state justClicked for each cell.
Use in didSelect

Code Block
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
let indexesToRedraw = [indexPath]
selectedIndex = indexPath
// Do what you need here
justClicked[indexPath.row] = true
tableView.reloadRows(at: indexesToRedraw, with: .fade)
// go to next "page"
sleep(1)
justClicked[indexPath.row] = false
tableView.reloadRows(at: indexesToRedraw, with: .fade)
}

And use in cellForRowAt
Code Block
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Some identifier", for: indexPath)
// Load the cell content
if selectedIndex == indexPath {
if justClicked[indexPath.row] {
cell.backgroundColor = UIColor.black
} else {
cell.backgroundColor = UIColor.blue // or the normal color
}
}
return cell
}

Unfortunately it still does not work. Maybe because I worked with the storyboard ? I linked the table view cell to another view, it works, but if I click on the the table view cell it gets light grey for just a moment before it shows the next page. Thanks to you it changes back to the original color when I go back.
tableView.reloadRows(at: indexesToRedraw, with: .fade)
was the line of code, which caused that. Should I try to get rid of the link in the storyboard and try it with code ?
Should I try to get rid of the link in the storyboard and try it with code ?

yes, remove the direct segue.
Create a segue from the ViewController to the next page.
Give it an identifier.
Then call performSegue at the very end of didSelectRowAt.

You may need to tell in prepare for segue which content to display, depending on the cell.
Code Block func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        let indexesToRedraw = [indexPath]
        selectedIndex = indexPath
        array[indexPath.row] = true
        tableView.reloadRows(at: indexesToRedraw, with: .fade)
        sleep(1)
        array[indexPath.row] = false
        tableView.reloadRows(at: indexesToRedraw, with: .fade)
        performSegue(withIdentifier: "shownext", sender: indexesToRedraw)
   }

Code Block func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
        cell.textLabel?.text = array[indexPath.row]
        if selectedIndex == indexPath {
            if array[indexPath.row] {
                cell.backgroundColor = UIColor.black
            }
            else{
                cell.backgroundColor = UIColor.blue
            }
            cell.setSelected(true, animated: true)
        }

I basically did what you proposed, but the cell still turns light grey when clicked, I think somewhere in my code I did a basic mistake, but I can not figure it out. Thanks a lot for helping me this far.


Add some print to understand what happens

Code Block
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
cell.textLabel?.text = array[indexPath.row]
if selectedIndex == indexPath {
if array[indexPath.row] {
print("Paint it black", selectedIndex)
cell.backgroundColor = UIColor.black
}
else {
print("Paint it blue", selectedIndex)
cell.backgroundColor = UIColor.blue
}
cell.setSelected(true, animated: true)
}

Change color of table view cell when clicked
 
 
Q