본문 바로가기

IOS

[IOS] UIColor Extension

이번 포스팅에는 

RGB Color를 보다 간단하게 작성하거나,

16진수 또는 RGB 같은 형식에서 얽메이지 않고

색상을 구현할 수 있도록 변환하는

Extension을 포스팅 하겠다.

 

UIColor init중 하나인 하단 이미지를 보면

rgb값과 마지막에 alpha 값을 지정해주도록

init을 받고있는게 있다.

그러나 이 alpha 값 하나 써주기 은근 귀찮다.

 

 

하단 Extension 코드와 같이 

기본값을 1로 가지고 있는 Extension을 

만들어 조금이나마 간편하게 사용할 수 있다.

Extension UIColor {
    convenience init(red: Int, green: Int, blue: Int) {
        self.init(red: CGFloat(red) / 255.0, green: CGFloat(green) / 255.0, blue: CGFloat(blue) / 255.0, alpha: 1.0)
    }
}

 

ex)

// view.backgroundColor = UIColor(red: 111, green: 222, blue: 333, alpha: 1)

view.backgroundColor = UIColor.init(red: 111, green: 222, blue: 333)

 

 

다음 Extension은

0x 접두사를 사용한

16 진수 표기법으로 

color를 지정하는 코드이다.

 

16진수 색상을. 가지고 있다면

하단 Extension을 사용하자

Extension UIColor {
   convenience init(rgb: Int) {
       self.init(
           red: (rgb >> 16) & 0xFF,
           green: (rgb >> 8) & 0xFF,
           blue: rgb & 0xFF
       )
   }
}

 

ex)

view.backgroundColor = UIColor(rgb: 0x123456)

 

 

 

이번에는 

Hex 색상을 color로 반환하는 메서드이다

 

#을 접두사로 가지고 있는 

HEX 색상을 가지고 있을때

String 타입의 Hex 색상코드 그대로

전달인자로 넣으면 UIColor를 return 한다.

func hexStringToUIColor (hex:String) -> UIColor {
        var cString:String = hex.trimmingCharacters(in: .whitespacesAndNewlines).uppercased()

        if (cString.hasPrefix("#")) {
            cString.remove(at: cString.startIndex)
        }

        if ((cString.count) != 6) {
            return UIColor.gray
        }

        var rgbValue:UInt64 = 0
        Scanner(string: cString).scanHexInt64(&rgbValue)

        return UIColor(
            red: CGFloat((rgbValue & 0xFF0000) >> 16) / 255.0,
            green: CGFloat((rgbValue & 0x00FF00) >> 8) / 255.0,
            blue: CGFloat(rgbValue & 0x0000FF) / 255.0,
            alpha: CGFloat(1.0)
        )
    }

 

ex)

view.backgroundColor = hexStringToUIColor(hex: "#3eb489")

 

TIP

자주 사용하는 color가 있다면 아래와 같이

타입 프로퍼티를 생성해서 사용하는걸 추천한다.

 

여러 곳에서 사용하는 공통 색상에 대한 컨트롤을 

보다 쉽게 할 수 있으며 (유지 보수 최고)

가독성 증가에도 도움이 된다.

Extension UIColor {
    static let mainColor = UIColor(red: 223, green: 223, blue: 223)
}
.
.
.
view.backgroundColor = .mainColor

 

 

디자이너와 협업을 할 때

색상을 어떤 타입으로 전달받을지는 

디자이너의 몫에 달려 있을것이고

그에 대한 준비를 해놓으면 나쁘지 않을것이다.

'IOS' 카테고리의 다른 글

[IOS] UserDefaults  (0) 2021.01.05
[IOS] UserInterfaceStyle (2)  (0) 2021.01.04
[IOS] 키보드 내리기 with TextField  (0) 2020.12.23
[IOS] UserInterfaceStyle  (0) 2020.12.22
[IOS] 이미지와 라벨을 같이 사용한 NavigationBarButtonItem  (0) 2020.12.21