자주 쓰이는 컬러를 쉽게 사용할 수 있도록 코드를 설정해주었다

Color 익스텐션을 통해 Hex코드를 활용해서 값을 추출해내는 생성자를 직접 만들어줄수도 있지만 나는 간단히 Asset에 등록하는 방법으로 설정해주었다.

🥨 1. asset파일에 컬러 등록

1) Asset을 관리하는 폴더에 Colors.xcassets 파일을 만들어준다.

2) 우측마우스 클릭하여 New Color Set을 클릭해준다.

3) 컬러의 이름을 지정해주고 Inspector 창을 열어준다.

4) Any Apprearance 혹은 Dark 를 클릭하면 우리가 원하는 컬러를 지정할 수 있게 된다. 나는 Hex 코드 형태로 컬러를 지정하고 싶었기 때문에 input method를 8-bit Hexadecimal 로 선택해주었다.

5) 원하는 hex 코드를 입력하고 엔터를 눌러주면 이렇게 컬러가 지정된다

🥨 2. Color의 extension으로 코드에서 바로 사용할 수 있도록 색 지정해주기


extension Color {
    static let newColor = Color("newColor")
    ...
}

🥨 3. 등록한 색깔을 코드에 활용

struct ContentView: View {
    var body: some View {
        VStack {
             Rectangle()
                 .frame(width: 200)
                .foregroundColor(.newColor)
        }
    }
}

이렇게 하면 어렵지 않게 컬러명을 등록해서 사용할 수 있다