SwiftUI, 스위프트 UI 배경 색깔 지정

SwiftUI, 스위프트 UI 배경 색깔 지정

이게 뭐라고 한참을 헤맸다. css처럼 background-color : "#dedede" 요렇게 하면 깔끔하고 좋을텐데. 그렇다고 막 어려운 건 아니지만 헤맸기에 정리하기 위해 정해둔다.

 

나는 컬러값 hex 코드로 알고 있고 그냥 string값으로 넣으면 딱 바뀌겠지 했는데 그게 아니었다. 일단 색상을 hex코드로 넣을 수가 없다. 넣는 방법이 있긴 하던데 또 UIColor를 extension하고 해야 되길래 난 그런거 딱 질색이라 그냥 hex코드는 안쓰기로 했다. RGB는 사용할 수 있다. 그래서 일단 내가 원하는 hex코드는 rgb로 바꿔주는 사이트에서 바꿨다.

 

www.rgbtohex.net/hextorgb/

HEX to RGB

 

위 사이트에서 rgb값을 얻어낸 다음, 아래와 같이 코드를 작성하면 배경색을 지정할 수 있다.

struct ContentView: View {
    var body: some View {
        ZStack{
            Color(red: 52 / 255, green: 152 / 255, blue: 219 / 255).ignoresSafeArea()
        }
    }
}

 

여기서 중요한건 rgb각 요소를 255로 나눈 값을 넣어야 된다는 것이다.  Color 함수에서 요구하는 값도 Double값이다. 뒤에 ignoresSafeArea()라는 함수도 사용하고 있는데 만약 사용안하면 어떻게 되는지 보여주겠다.

위아래로 있는 불편한 여백들

위 아래에 흰색이 보이고 있다. 저 부분을 safeArea라고 하는데 저 부분을 무시한다고 말해줘야된다. 그래서 완성된 코드가 위에 예시로 만들어진 코드이다. 그리고 위 아래 여백이 사라진 깔끔한 배경색이 있는 화면을 볼 수 있다.

꽉찬 배경색