UIView backgroundColor disappears when UITableView

Question

I have a simple tableViewCell build in interface builder. It contains a UIView which contains an image. Now, when I select the cell, the default blue selection background is shown, but the backgroundColor of my UIView is gone.

My UITableViewCell's implementation file doesn't do anything special. It just init's & returns self and all I do in setSelected is call super.

How do I get my UIView backgroundColor to show when the tableView is selected?

Answer 1

Here's my take on it. I have a subclass that all my cell inherit from, so that's the way I do it to avoid the background change in my UIImageViews:

    override func setHighlighted(highlighted: Bool, animated: Bool) {
    var backgroundColors = [UIView: UIColor]()

    for view in contentView.subviews as [UIView] {
        if let imageView = view as? UIImageView {
            backgroundColors[imageView] = imageView.backgroundColor
        }
    }

    super.setHighlighted(highlighted, animated: animated)

    for view in contentView.subviews as [UIView] {
        if let imageView = view as? UIImageView {
            imageView.backgroundColor = backgroundColors[imageView]
        }
    }
}

override func setSelected(selected: Bool, animated: Bool) {
    var backgroundColors = [UIView: UIColor]()

    for view in contentView.subviews as [UIView] {
        if let imageView = view as? UIImageView {
            backgroundColors[imageView] = imageView.backgroundColor
        }
    }

    super.setSelected(selected, animated: animated)

    for view in contentView.subviews as [UIView] {
        if let imageView = view as? UIImageView {
            imageView.backgroundColor = backgroundColors[imageView]
        }
    }
}

This automaticlly fix the issue for all UIImageView.

Answer 2

Swift 4

In your UITableViewCell class:

override func setSelected(_ selected: Bool, animated: Bool) {
    myView.backgroundColor = UIColor.blue
}

override func setHighlighted(_ highlighted: Bool, animated: Bool) {
    myView.backgroundColor = UIColor.blue
}

Answer 3

Related to @Brooks's answer, this is what I did to make it work in Swift and iOS8/iOS9.

• Override the setSelected and setHighlighted
• Don't call super
• Clear out the contentView.backgroundColor, because it does not have to span over the whole width of the cell (i.e. accessories).

• Use the backgroundColor of the cell itself, and set it accordingly.

  class AwesomeTableViewCell: UITableViewCell {
  
      private struct Constants {
  
          static var highlightedColor = UIColor.greenColor()
          static var selectedColor = UIColor.redColor()
  
          static let animationTime = NSTimeInterval(0.2)
      }
  
      override func awakeFromNib() {
          super.awakeFromNib()
  
          contentView.backgroundColor = UIColor.clearColor()
          backgroundColor = AppContext.sharedInstance.theme.colors.background
      }
  
      override func setHighlighted(highlighted: Bool, animated: Bool) {
          if animated {
              UIView.animateWithDuration(Constants.animationTime, animations: { () -> Void in
                  self.setHighlighted(highlighted)
              })
          } else {
              self.setHighlighted(highlighted)
          }
      }
  
      override func setSelected(selected: Bool, animated: Bool) {
  
          if animated {
              UIView.animateWithDuration(Constants.animationTime, animations: { () -> Void in
                  self.setSelected(selected)
              })
          } else {
              self.setSelected(selected)
          }
      }
  
      private func setHighlighted(highlighted: Bool) {
  
          backgroundColor = highlighted ? Constants.highlightedColor : UIColor.whiteColor()
      }
  
      private func setSelected(selected: Bool) {
  
          backgroundColor = selected ? Constants.selectedColor : UIColor.whiteColor()
      }
  }
  

Answer 4

The problem here is that the [super] implementation of

- (void) setSelected:(BOOL) selected animated:(BOOL) animated;

sets all the background colors in the UITableViewCell to rgba(0,0,0,0). Why? Perhaps to make us all sweat?

It is not that entire views disappear (as evidenced by the fact that if you change the views layer border properties, those are retained)

Here is the sequence of function calls that results from touching a cell

1. setHighlighted
2. touchesEnded
3. layoutSubviews
4. willSelectRowAtIndexPath (delegate side)
5. setSelected (!!! this is where all your view background colors are told to disappear)
6. didSelectRowAtIndexPath (delegate side)
7. setSelected (again) (Interestingly background colors not cleared on this call. What strangeness is going on inside that super method?)
8. layoutSubviews (again)

So your options are to

1. Override - (void) setSelected:(BOOL) selected animated:(BOOL) animated; without calling [super setSelected:selected animated:animated]. This will give you the most technically correct implementation because a) the code is wrapped up inside the UITableViewCell subclass and b) because it is only called when needed (well twice when needed, but maybe there is a way around that). The down side is you'll have to re-implement all the necessary functions (as opposed to unnecessary color clearing functions) of setSelected. Now don't ask me how to properly override setSelected just yet. Your guess is as good as mine for now (be patient, I'll edit this answer once I figure it out).
2. Re-assert the background colors in didSelectRowAtIndexPath. This is not so great because it puts what should be instance code outside the instance. It has the upside that it is only called when it is needed, as opposed to ...
3. Re-assert the background colors in layoutSubviews. This is not great at all because layoutSubviews is called like A MILLION times! It is called every time the table refreshes, every time it scrolls, every time you grandmother gets a perm... like seriously, a million times. That means there is a lot of unnecessary background re-assertions and a lot of extra processing overhead. On the bright side it puts the code inside the UITableViewCell subclass, which is nice.

Unfortunately re-asserting the background colors in setHighlighted does nothing because setHighlighted is called before all the background colors get set to [r:0 b:0 g:0 a:0] by the first call to setSelected.

//TODO: Give a great description of how to override setSelected (stay tuned)

Answer 5

When your UITableViewCell is selected, there are two states you should pay attention to: Highlighted and Selected.

So, for scenarios that you have a custom cell class which is subclass of UITableViewCell, you can easily override these two methods to avoid this situation(Swift):

class MyCell: UITableViewCell {

    @IBOutlet var myView: UIView!

    override func setHighlighted(highlighted: Bool, animated: Bool) {
        let myViewBackgroundColor = myView.backgroundColor
        super.setHighlighted(highlighted, animated: animated)
        myView.backgroundColor = myViewBackgroundColor
    }

    override func setSelected(selected: Bool, animated: Bool) {
        let myViewBackgroundColor = myView.backgroundColor
        super.setSelected(selected, animated: animated)
        myView.backgroundColor = myViewBackgroundColor
    }

}

Answer 6

Just spent some time on this weird issue. I did not want to set UITableViewCellSelectionStyleNone style to preserve nice animation when my row was selected. But none of suggested ideas worked for me - I was trying to override setSelected and setHighlighted and set my subview backgroundColor there - it was keeping resetting by iOS and still blinking (new color -> old color). For me the fix was quite simple. When my row is selected another view controller is pushed, user chooses some option on that screen and delegate is called where I change the color based on user selection. In this delegate I just do [cell setSelected:NO animated:NO] for my cell. (I have static UITableViewController and have outlets to cells). You could probably deselect cell in didSelect method but in my case I'm using segues.