メインコンテンツにスキップ

nativeTheme

Chromiumのネイティブカラースキームの変更を読み取り、対応します。

プロセス: メイン

イベント

nativeThemeモジュールは、以下のイベントを発行します。

イベント: 'updated'

基盤となるNativeThemeに何か変更があった場合に発行されます。これは通常、shouldUseDarkColorsshouldUseHighContrastColors、またはshouldUseInvertedColorSchemeの値が変更されたことを意味します。どれが変更されたかを判断するには、それらをチェックする必要があります。

プロパティ

nativeThemeモジュールには、以下のプロパティがあります。

nativeTheme.shouldUseDarkColors 読み取り専用

OS/Chromiumが現在ダークモードを有効にしているか、ダークスタイルのUIを表示するように指示されているかどうかのboolean値です。この値を変更したい場合は、以下の`themeSource`を使用してください。

nativeTheme.themeSource

systemlight、またはdarkを指定できるstringプロパティです。Chromiumが内部的に使用する値をオーバーライドするために使用されます。

このプロパティをsystemに設定すると、オーバーライドが削除され、すべてがOSのデフォルトにリセットされます。デフォルトでは、`themeSource`は`system`です。

このプロパティをdarkに設定すると、以下の効果があります。

  • アクセス時にnativeTheme.shouldUseDarkColorstrueになります。
  • コンテキストメニュー、開発ツールなど、ElectronがLinuxおよびWindowsでレンダリングするUIは、ダークUIを使用します。
  • メニュー、ウィンドウフレームなど、OSがmacOSでレンダリングするUIは、ダークUIを使用します。
  • prefers-color-scheme CSSクエリは、darkモードに一致します。
  • updatedイベントが発行されます。

このプロパティをlightに設定すると、以下の効果があります。

  • アクセス時にnativeTheme.shouldUseDarkColorsfalseになります。
  • コンテキストメニュー、開発ツールなど、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`値です。