Xcode 기능 - 색상 선택, 저장, 불러오는 방법 / select, save, get color data (UIColorPicker)

이번에는 이전글에 이어서 UserDefault를 사용하여

간단하게 색상을 저장하는 방법에 대해 알아볼께요

 

 

얼마전에 개인 업데이트를 하면서 알게된 기능인데

생각보다 간편하게 구현이 되어 추가적으로 글올립니다

 

컬러값이 아닌 기본변수를 저장하는 경우 아래링크를 참고해주시면 됩니다!

fdee.tistory.com/entry/Xcode-기능-간단한-내용-저장-불러오기-save-get-simple-data-with-userDefault

Xcode 기능 - 간단한 내용 저장, 불러오기 / save, get simple data with userDefault

 

1) AppDelegate

이번에는 기존 UserDefault 방식과는 조금 다른 방식이기 때문에 컬러를 자주 저장하고 사용하신다면

AppDelegate에서 한번 코드 작성하시면 각 ViewController 에서 편하게 사용이 가능하시답니다

 

이런식으로 AppDelegate 아래에 그대로 넣어주시면 됩니다!

extension UserDefaults {
    func colorForKey(key: String) -> UIColor? {
        var color: UIColor?
        if let colorData = data(forKey: key) {
            color = NSKeyedUnarchiver.unarchiveObject(with: colorData) as? UIColor
        }
        return color
    }
    
    func setColor(color: UIColor?, forKey key: String) {
        var colorData: NSData?
        if let color = color {
            colorData = NSKeyedArchiver.archivedData(withRootObject: color) as NSData?
        }
        set(colorData, forKey: key)
    }
}

위 코드의 역할은 바로

원래는 UserDefault로 UIColor 값을 저장을 할 수 없는데 위 코드를 통해

UserDefault를 확장해서 UIColor 값을 저장, 가져올 수 있도록 추가한 겁니다

 

구글링으로 알게되었는데 덕분에 정말 편하게 저장이 가능합니다ㅠㅠ

 

그러면 준비가 끝났습니다!

 

2) ViewController

이제 ViewController 에서 편하게 저장하고 가져올 수 있답니다

 

 

이런식으로 컬러를 저장하여 배경색을 지정할 수 있답니다

 

2) 컬러 선택화면 띄우는 방법

먼저 컬러를 저장하기에 앞서 컬러를 선택할 수 있게 창을 띄우는 방법을 알려드릴께요

이 기능은 참고로 iOS14부터 새로생긴 기능이기 때문에 iOS13 이전 기기들에서는 뜨지가 않습니다

< 컬러 선택화면 띄우는 코드 >

if #available(iOS 14.0, *) {
    //컬러선택화면
    let picker = UIColorPickerViewController()
    //초기컬러값 설정
    picker.selectedColor = COLOR!
    picker.delegate = self
    self.present(picker, animated: true, completion: nil)
} else {
    // Fallback on earlier versions
}

여기서 UIColorPickerViewController() 이 함수가 iOS 14부터 새로생긴 기능이랍니다

함수를 부름으로써 자동으로 컬러 선택 화면이 뜨게 됩니다!

 

위 함수의 이름인 picker.selectedColor를 통해 초기 컬러값을 설정할 수 있습니다

여기서 사용된 COLOR!의 경우 기존에 저장된 컬러값을 지닌 변수입니다

var COLOR = UIColor(named: "Background2")

코드로 컬러를 가져오는 방법에 대해선 아래 글을 참고해주세요!

fdee.tistory.com/entry/Xcode-기능-코드로-색상-설정-및-변경하기-set-color-with-swift

Xcode 기능 - 코드로 색상 설정 및 변경하기 / set color with swift

이렇게 몇가지 설정으로 컬러 선택창을 띄울 수 있답니다!

 

3) 선택한 색상값 가져오기

컬러창을 띄웠다고 다가 아니죠, 컬러값을 가져와야 저장이 가능하겠죠?

 

컬러값을 가져오는 것은 UIColorPickerViewControllerDelegate를 활용해야 하기 때문에

위 이미지처럼 해당 ViewController 에 extension이 필요합니다

< 선택한 색상값 가져오기 코드 >

extension SetTimerViewController2 : UIColorPickerViewControllerDelegate {
    
    @available(iOS 14.0, *)
    func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) {
        print(viewController.selectedColor)
        COLOR = viewController.selectedColor
        updateColor()
    }
    
    @available(iOS 14.0, *)
    func colorPickerViewControllerDidFinish(_ viewController: UIColorPickerViewController) {
        print(viewController.selectedColor)
        COLOR = viewController.selectedColor
        updateColor()
    }
}

이 기능 역시 iOS 14 이후부터 가능합니다

먼저 colorPickerViewControllerDidSelectColor 함수는 색상값을 드래그하면서 수시로 바뀌는 색을 가져오는 함수입니다

간단하게 실시간으로 컬러를 가져온다고 생각하면 됩니다

colorPickerViewControllerDidFinish 함수는 컬러선택이 종료된 경우이니 마지막에 실행됩니다

 

이 두함수에 모두 컬러를 저장하겠금 구현하면 됩니다!

그러면 컬러를 저장하기위한 위에서 만든 변수 COLOR에 저장을 해보겠습니다

viewController.selectedColor 함수를 통해 색을 가져올 수 있습니다!

 

간단하죠?

위의 두가지 함수를 통해 컬러 선택창에서 선택한 컬러를 COLOR 변수에 저장을 했습니다!

 

4) 색상 저장하기

이제 본격적으로 색도 가져왔으니 저장을 해봅시다

 

< 색상 저장하는 코드 >

UserDefaults.standard.setColor(color: COLOR, forKey: "color")

여기서 color 값는 저장하고자 하는 변수인 value 값이고,

forKey 값은 저장시 사용되는 이름인 key 값 입니다

 

맨 처음 AppDelegate 에서 미리 extension으로 구현한 setColor 함수를 통해 손쉽게 저장이 가능하답니다!

 

5) 색상 불러오기

이제 마지막으로 저장된 색상을 가져와봅시다

 

< 색상 불러오기 코드 >

COLOR = UserDefaults.standard.colorForKey(key: "color") 
    as? UIColor ?? UIColor(named: "Background2")

여기서 COLOR는 색을 저장하는 변수입니다

key 값은 저장시 사용된 이름입니다 이 key 값을 통해 색을 가져오게 됩니다!

 

뒤에 있는 as ? UIColor ?? UIColor(named: "Background2") 이 뜻은 뭔가요??

바로 UIColor 형태이며, 저장된 값이 없을시 Background2 이름의 색을 기본값으로 설정한다는 의미입니다

이전 글에서 간단히 다뤘던 내용과 비슷하죠?

 

 

이렇게 컬러를 선택하고, 저장하고, 가져올 수 있답니다!