본문 바로가기
FRONT-END/iOS

[xcode] Dark, Light 모드 지정하기

by 랄라J 2024. 4. 1.

시뮬레이터에서는 잘 나오던 화면이 핸드폰을 연결해 앱으로 열었더니!

 

아니... 내 글씨들 어디 갔어….? 왜 이래ㅠㅠ..

하.. 한 땀 한 땀 배경색과 컬러를 지정해줘야 하나 싶어 지정하다가

문득 드는 생각, 핸드폰으로 열면 다크모드로 보이게 처리가 되어있는 건가?

 

찾아보니 기본 설정으로는 시스템에서 설정한 모드를 따라간다고 한다!

시스템 설정 모드와 관계없이 모드를 고정하고 싶다면 UserInterfaceStyle을 고정하여 이런 현상을 방지할 수 있다고 한다.

 

그래서 찾아봤더니 방법으로는 2가지가 나왔다.

1. Info.plist에 추가

2. SceneDelegate에 추가해서 light, dark 모드를 지정

 

방법 1. Info.plist에 추가

이 방법을 찾아보며 알게 된 사실이 하나 있다.

항상 Info.plist를 열면 당연히 아래와 같은 형태로 나와서 당연하다고 생각하고 있었는데!

 

근데 이렇게 Open As로 Source Code로 열 수 있었다..!?

 

그리고 코드를 열면 이렇게 xml 형태로 된 것을 확인할 수 있다.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
	<key>FoodSafetyKoreaApiKey</key>
	<string>${FOOD_SAFETY_KOREA_API_KEY}</string>
	<key>NSCameraUsageDescription</key>
	<string></string>
	<key>UIAppFonts</key>
	<array>
		<string>NotoSans-Medium.ttf</string>
		<string>NotoSans-ExtraBold.ttf</string>
	</array>
	<key>UIApplicationSceneManifest</key>
	<dict>
		<key>UIApplicationSupportsMultipleScenes</key>
		<false/>
		<key>UISceneConfigurations</key>
		<dict>
			<key>UIWindowSceneSessionRoleApplication</key>
			<array>
				<dict>
					<key>UISceneConfigurationName</key>
					<string>Default Configuration</string>
					<key>UISceneDelegateClassName</key>
					<string>$(PRODUCT_MODULE_NAME).SceneDelegate</string>
				</dict>
			</array>
		</dict>
	</dict>
</dict>
</plist>

 

여기에 Light 모드를 설정하고 싶은 경우 아래 코드를 추가해 주면 된다!

<key>UIUserInterfaceStyle</key>
<string>Light</string>

(당연하게도 Dark 모드로 고정하고 싶으면 Light가 아니라 Dark를 넣어주면 됨)

 

근데 한 가지 포인트!

plist로 바꿔서 확인해 보면 xml에서는 key를 UIUserInterfaceStyle로 추가했는데, plist로 보이는 Key는 Appearance로 보인다.

(오..🫢 그래서 code로 넣으라고 한 거구나! 실제로 그냥 plist에서 UIUserInterfaceStyle를 Key로 넣으려면 해당하는 정보가 없다!)

 

궁금해서 반대로 plist에 Appearance key로 넣고 Light를 추가해 봤는데도 동일한 결과가 나온다 😊

code를 열어봤더니 Appearance key는 자동으로 xml로 변환될 때는 UIUserInterfaceStyle이 나옴을 확인할 수 있었다.

 

2. SceneDelegate 추가하기

window?.overrideUserInterfaseStyle을 설정해 주면 된다.

func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
    window?.overrideUserInterfaceStyle = .light
    guard let _ = (scene as? UIWindowScene) else { return }
}

 

 

나는 1번 방법을 활용해 지정해 주었다.

 

그랬더니 Dark모드로 자기 맘대로 지정해 없어졌던 배경과 색상이 돌아왔다ㅎㅎㅎ😁

728x90

댓글