Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
Tags
- 화면전환
- 구조적특징
- 고차함수
- 회고
- SWIFT
- SwiftStyle
- protocol
- list
- IOS
- error
- self
- NotificationCenter
- PushNotification
- struct
- escaping
- array
- SWIFTUI
- 글또
- uikit
- calendar
- http
- ScrollView
- 점진적로딩
- class
- Refresh
- Git
- segue
- Switch
- viewlifecycle
- apns
Archives
- Today
- Total
seong_hye, the developer
Swift) DarkMode 활용하기(ColorScheme) 본문
📘 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)
}
}
}
'IOS > SwiftUI' 카테고리의 다른 글
Swift) Swift 스타일에 대해 알아보기 (0) | 2022.11.29 |
---|---|
Swift) 배열 데이터 나누고 리플래시로 받아오기 (0) | 2022.11.16 |
SwiftUI) Toast 생성해보기(normal, enum에 따른 toast) (0) | 2022.10.29 |
SwiftUI) View Life Cycle (0) | 2022.10.27 |
SwiftUI) App Protocol에 대해 알아보기 (0) | 2022.10.25 |
Comments