IOS/SwiftUI
Swift) DarkMode 활용하기(ColorScheme)
seong_hye
2022. 11. 3. 21:42
📘 DarkMode
Swift에서는 iOS 13이상에서는 기본적으로 시스템 다크모드에 따라 UI가 자동으로 반응함시스템 색상을 사용하면 라이트/다크 모드에 따라 색상이 변경됨
시스템 색상 | 라이트 모드 | 다크 모드 |
.systemBackground | 흰색 | 검정 |
.label | 검정 | 흰색 |
.secondaryLabel | 회색 | 연회색 |
.systemGray | 중간 회색 | 중간 회색 (어두움) |
➡️시스템 색상 적용 방법
Text("자동 색상 대응")
.background(Color(.background))
.foregroundColor(Color(.primary))
🔹 ColorScheme
SwiftUI에서 현재의 색상 모드 ( = 다크모드 / 라이트모드)를 나타내는 열거형(enum)
다크 모드 대응 UI를 만들 떄 핵심적으로 사용되는 환경 값
✅ ColorScheme 정의
enum ColorScheme {
case light
case dark
}
✅ 사용 예시
struct ContentView: View {
@Environment(\.colorScheme) var colorScheme
var body: some View {
Text(colorScheme == .dark ? "다크 모드" : "라이트 모드")
.padding()
.background(colorScheme == .dark ? Color.black : Color.white)
.foregroundColor(colorScheme == .dark ? Color.white : Color.black)
}
}
🔹 다크모드 or 라이트 모드 강제 적용
preferredColorScheme(_:) 수정자를 사용해 강제 적용할 수 있음
✅ 뷰 단위에서 강제 적용
struct COntentView: View {
var body: some View {
Text("강제로 다크 모드 적용 중")
.padding()
.preferredColorScheme(.dark)
}
}
.dark: 강제로 다크 모드
.light: 강제로 라이트 모드
.none: 시스템 설정에 따름
✅앱 전체에 강제 적용
preferredColorScheme을 최상위 WindowGroup이나 Scene에 적용하면 앱 전체에 영향을 줌
@main
struct TestApp: App {
var body: some Scene {
WindowGroup {
ContentView()
.preferredColorScheme(.dark)
}
}
}