もちゅろぐ
iOS
UITableView
UITableViewCell(セル)のサブビュー背景色が消える原因と解決法

UITableViewCell(セル)のサブビュー背景色が消える原因と解決法

2019-9-29

Table of Contents

原因は色を透明化してるため
色を復元して対処する
- Highlightedとは？
- Selectedとは？

UITableViewのUITableViewCell(セル)をカスタマイズでサブビューに背景色をつけることがありますが、
そのセルをタップしてハイライト状態(Highlighted)や選択状態(Selected)にしたときに、サブビューの背景色が消える現象に遭遇した人は多いと思います。
そんなバグの直し方を説明します。

原因は色を透明化してるため

例えば次のようにレイアウトされたセルを用意する。

このセルをタップ直後のボタン(button)の背景色を確認すると下記のようになる。

(lldb) po button.backgroundColor
▿ Optional<UIColor>
  - some : UIExtendedGrayColorSpace 0 0

ピンクではなく透明になっている。
背景色が消える原因はこれになる。

色を復元して対処する

対処法はセルが選択されて色が透明になったら復元させて対処する。

class TableCell: UITableViewCell {
    @IBOutlet private weak var button: UIButton!
    @IBOutlet private weak var textField: UITextField!
    @IBOutlet private weak var label: UILabel!

    private var defaultButtonBackgroundColor: UIColor?
    override func awakeFromNib() {
        super.awakeFromNib()
        defaultButtonBackgroundColor = button.backgroundColor
    }

    override func setHighlighted(_ highlighted: Bool, animated: Bool) {
        super.setHighlighted(highlighted, animated: animated)
        if highlighted {
            button.backgroundColor = defaultButtonBackgroundColor
        }
    }
    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
        if selected {
            button.backgroundColor = defaultButtonBackgroundColor
        }
    }
}