UIButton 아이콘을 지원하는 다크 모드

배경

어두운 모드를 지원할 때 단추의 TextColor만 바꾸면 이렇게 됩니다🤯

디자이너도 바쁜가 봐요. 버튼에 설정된 단색 아이콘이라면 코드로 색을 바꾸는 게 편하겠죠...?
따라서 UIButton을 위한 사용자 정의 클래스를 만들기로 했습니다.

해보다

이것은 이번에 한 것이다.
버튼 아이콘과 텍스트를 다른 색으로 설정하고 싶은 사람에게 적합합니다.

사용자 정의 클래스 준비

먼저 @IBInspectable 에서는 스토리보드에서 색상을 설정할 수 있습니다.
그리고 화면을 표시하는 도중에 모드를 전환할 때 draw() 색상을 변경합니다.
겸사겸사 하이라이트 색상도 설정해 주세요.


class IconButton: UIButton {
    @IBInspectable var iconColor: UIColor?

    override func draw(_ rect: CGRect) {
        super.draw(rect)
        self.setTitleColor(self.currentTitleColor.withAlphaComponent(0.5), for: .highlighted)

        if let image = self.image(for: .normal), let iconColor = self.iconColor {
            self.setImage(image.tint(color: iconColor), for: .normal)
            self.setImage(image.tint(color: iconColor.withAlphaComponent(0.5)), for: .highlighted)
        }
    }
}

extension UIImage {
    func tint(color: UIColor) -> UIImage? {
        UIGraphicsBeginImageContextWithOptions(self.size, false, 0)
        color.setFill()
        let drawRect = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)
        UIRectFill(drawRect)
        self.draw(in: drawRect, blendMode: .destinationIn, alpha: 1)
        let tintedImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return tintedImage
    }
}