[iOS] UIColorWell로 커스텀 컬러 선택하기

https://developer.apple.com/documentation/uikit/uicolorwell

Apple Developer Documentation

 

공식 문서에는 짧게 한 줄로 설명되어 있다. 

 

컬러 픽커를 보여주는 화면을 컨트롤한다. 

 

바로 코드와 화면으로 보는게 빠를 것 같다. 

 

우선 UIColorWell을 사용하기 위해서는 버튼을 하나 만들어줘야 한다. 

let colorPicker = UIColorWell(frame: CGRect(x: 100, y: 100, width: 100, height: 100)

 

frame와 CGRect로 크기를 정해주고 addSubview하게 되면 아래와 같은 아이콘을 볼 수 있다.

 

 

해당 아이콘을 클릭하게 되면 색상을 선택할 수 있는 화면이 present된다.

UIColorWell

잘 보면 세 가지 형태로 색을 고를 수 있는 것을 확인해볼 수 있다. 

좌측 상단의 스포이트를 누르면 현재 뷰에서 원하는 색상을 선택해서 고를 수 있다.

 

취향에 맞게, 목적에 맞게 원하는 탭으로 이동해서 색상을 선택한 후 X를 클릭하면 아이콘의 색이 반영된 것을 알 수 있다. 

 

icon의 색상이 변하는 모습!

 

이렇게 커스텀하게 컬러를 선택하는 방법을 알아보았다. 

이제 선택한 컬러가 배경으로 반영해보자!

 

// colorButton의 addAction에 추가해준다.

@objc func colorChanged(sender: Any) {
    self.view.backgroundColor = colorButton.selectedColor
}

 

이렇게 컬러를 커스텀하게 설정하는 방법을 알아보았다. 

유저들에게 자유롭게 색상을 선택할 수 있도록 하여, 텍스트나 배경색을 다채롭게 설정할 수 있을 것 같다.

다만 색을 자유롭게 설정할 수 있다는 것은, 예외케이스가 발생할 수 있는 것이기에... (빨간 배경에 빨간 텍스트) 

처음부터 제한된 컬러만 제공하는 것도 나쁘지 않은 선택인 것 같다.