nativeTheme
读取并响应 Chromium 原生颜色主题的变化。
进程:主进程
事件
nativeTheme
模块发出以下事件
事件:'updated'
当底层 NativeTheme 中的内容发生变化时发出。这通常意味着shouldUseDarkColors
、shouldUseHighContrastColors
或 shouldUseInvertedColorScheme
的值发生了变化。您需要检查它们以确定哪个值发生了变化。
属性
nativeTheme
模块具有以下属性
nativeTheme.shouldUseDarkColors
只读
一个布尔值
,表示操作系统/Chromium 当前是否启用了暗模式或正在被指示显示暗色风格的 UI。如果您想要修改此值,请在下方使用themeSource
。
nativeTheme.themeSource
一个字符串
属性,可以是system
、light
或 dark
。它用于覆盖和取代 Chromium 在内部选择使用的值。
将此属性设置为system
将移除覆盖,并将所有内容重置为操作系统的默认值。默认情况下,themeSource
为system
。
将此属性设置为dark
将具有以下效果
- 访问
nativeTheme.shouldUseDarkColors
时将为true
- Electron 在 Linux 和 Windows 上渲染的任何 UI,包括上下文菜单、开发者工具等,都将使用暗色 UI。
- 操作系统在 macOS 上渲染的任何 UI,包括菜单、窗口框架等,都将使用暗色 UI。
prefers-color-scheme
CSS 查询将匹配dark
模式。- 将发出
updated
事件
将此属性设置为light
将具有以下效果
- 访问
nativeTheme.shouldUseDarkColors
时将为false
- Electron 在 Linux 和 Windows 上渲染的任何 UI,包括上下文菜单、开发者工具等,都将使用亮色 UI。
- 操作系统在 macOS 上渲染的任何 UI,包括菜单、窗口框架等,都将使用亮色 UI。
prefers-color-scheme
CSS 查询将匹配light
模式。- 将发出
updated
事件
此属性的使用应与应用程序中的经典“暗模式”状态机保持一致,用户有三个选项。
跟随操作系统
-->themeSource = 'system'
暗模式
-->themeSource = 'dark'
亮模式
-->themeSource = 'light'
然后,您的应用程序应始终使用shouldUseDarkColors
来确定要应用的 CSS。
nativeTheme.shouldUseHighContrastColors
macOS Windows 只读
一个布尔值
,表示操作系统/Chromium 当前是否启用了高对比度模式或正在被指示显示高对比度 UI。
nativeTheme.shouldUseInvertedColorScheme
macOS Windows 只读
一个布尔值
,表示操作系统/Chromium 当前是否具有反转的颜色方案或正在被指示使用反转的颜色方案。
nativeTheme.inForcedColorsMode
Windows 只读
一个布尔值
,指示 Chromium 是否处于强制颜色模式,由系统辅助功能设置控制。目前,Windows 高对比度是触发强制颜色模式的唯一系统设置。
nativeTheme.prefersReducedTransparency
只读
一个布尔值
,指示用户是否已通过系统辅助功能设置选择在操作系统级别降低透明度。