nativeTheme
Chromiumのネイティブカラースキームの変更を読み取り、対応します。
プロセス: メイン
イベント
nativeTheme
モジュールは、以下のイベントを発行します。
イベント: 'updated'
基盤となるNativeThemeに何か変更があった場合に発行されます。これは通常、shouldUseDarkColors
、shouldUseHighContrastColors
、またはshouldUseInvertedColorScheme
の値が変更されたことを意味します。どれが変更されたかを判断するには、それらをチェックする必要があります。
プロパティ
nativeTheme
モジュールには、以下のプロパティがあります。
nativeTheme.shouldUseDarkColors
読み取り専用
OS/Chromiumが現在ダークモードを有効にしているか、ダークスタイルのUIを表示するように指示されているかどうかのboolean
値です。この値を変更したい場合は、以下の`themeSource`を使用してください。
nativeTheme.themeSource
system
、light
、またはdark
を指定できるstring
プロパティです。Chromiumが内部的に使用する値をオーバーライドするために使用されます。
このプロパティをsystem
に設定すると、オーバーライドが削除され、すべてがOSのデフォルトにリセットされます。デフォルトでは、`themeSource`は`system`です。
このプロパティをdark
に設定すると、以下の効果があります。
- アクセス時に
nativeTheme.shouldUseDarkColors
はtrue
になります。 - コンテキストメニュー、開発ツールなど、ElectronがLinuxおよびWindowsでレンダリングするUIは、ダークUIを使用します。
- メニュー、ウィンドウフレームなど、OSがmacOSでレンダリングするUIは、ダークUIを使用します。
prefers-color-scheme
CSSクエリは、dark
モードに一致します。updated
イベントが発行されます。
このプロパティをlight
に設定すると、以下の効果があります。
- アクセス時に
nativeTheme.shouldUseDarkColors
はfalse
になります。 - コンテキストメニュー、開発ツールなど、ElectronがLinuxおよびWindowsでレンダリングするUIは、ライトUIを使用します。
- メニュー、ウィンドウフレームなど、OSがmacOSでレンダリングするUIは、ライトUIを使用します。
prefers-color-scheme
CSSクエリは、light
モードに一致します。updated
イベントが発行されます。
このプロパティの使い方は、ユーザーに3つのオプションがあるアプリケーションの古典的な「ダークモード」状態マシンと一致する必要があります。
OSに従う
-->themeSource = 'system'
ダークモード
-->themeSource = 'dark'
ライトモード
-->themeSource = 'light'
アプリケーションは、適用するCSSを決定するために、常に`shouldUseDarkColors`を使用する必要があります。
nativeTheme.shouldUseHighContrastColors
macOS Windows 読み取り専用
OS/Chromiumが現在ハイコントラストモードを有効にしているか、ハイコントラストUIを表示するように指示されているかどうかのboolean
値です。
nativeTheme.shouldUseInvertedColorScheme
macOS Windows 読み取り専用
OS/Chromiumが現在反転カラースキームを使用しているか、反転カラースキームを使用するように指示されているかどうかの`boolean`値です。
nativeTheme.inForcedColorsMode
Windows 読み取り専用
Chromiumが強制カラーモードになっているかどうかを示す`boolean`値です。システムのアクセシビリティ設定によって制御されます。現在、Windowsのハイコントラストは、強制カラーモードをトリガーする唯一のシステム設定です。
nativeTheme.prefersReducedTransparency
読み取り専用
ユーザーがシステムのアクセシビリティ設定でOSレベルで透明度を下げることを選択したかどうかを示す`boolean`値です。