NUGU SDK 의 NuguVoiceChrome, AudioDisplayView 등과 같은 UI Component 들은 각자 theme 이라는 변수를 통해 Dark / Light 모드 테마를 지원하고 있습니다. theme 변수를 직접 변경해주면 해당 UI Component 의 테마는 동적으로 변경됩니다.
1
2
3
4
5
6
7
8
9
public class NuguVoiceChrome: UIView {
public var theme: NuguVoiceChromeTheme
}
public class AudioDisplayView: UIView {
public var theme: AudioDisplayTheme
}
ex> nuguVoiceChrome.theme = .dark
고객의 편의를 위해 NuguClientKit 에서는 NuguThemeController 라는 컨트롤러 모델을 제공하고 있습니다. NuguThemeController 를 생성하여, VoiceChromePresenter, DisplayWebViewPresenter, AudioDisplayViewPresenter 의 생성자로 추가하면 해당 UI Component 들의 theme 가 NuguThemeController 와 연동됩니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
lazy var themeController = NuguThemeController()
private lazy var voiceChromePresenter = VoiceChromePresenter(
viewController: self,
nuguClient: NuguCentralManager.shared.client,
themeController: themeController
)
private lazy var displayWebViewPresenter = DisplayWebViewPresenter(
viewController: self,
nuguClient: NuguCentralManager.shared.client,
clientInfo: ["buttonColor": "white"],
themeController: themeController
)
private lazy var audioDisplayViewPresenter = AudioDisplayViewPresenter(
viewController: self,
nuguClient: NuguCentralManager.shared.client,
themeController: themeController
)
ex> themeController.theme = .dark