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

BrowserWindow

ブラウザーウィンドウを作成および制御します。

プロセス: メイン

このモジュールは、app モジュールの ready イベントが発行されるまで使用できません。

// In the main process.
const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ width: 800, height: 600 })

// Load a remote URL
win.loadURL('https://github.com')

// Or load a local HTML file
win.loadFile('index.html')

ウィンドウのカスタマイズ

BrowserWindow クラスは、アプリのウィンドウの外観と動作を変更するためのさまざまな方法を提供します。詳細については、ウィンドウのカスタマイズチュートリアルを参照してください。

ウィンドウを滑らかに表示する

ウィンドウに直接ページをロードすると、ユーザーはページが段階的にロードされるのを目にする可能性があり、ネイティブアプリとしては良い体験ではありません。ウィンドウを視覚的なちらつきなく表示するには、状況に応じて2つの解決策があります。

ready-to-show イベントを使用する

ページのロード中、ウィンドウがまだ表示されていない場合、レンダラープロセスがページを初めてレンダリングしたときに、ready-to-show イベントが発行されます。このイベントの後にウィンドウを表示すると、視覚的なちらつきは発生しません。

const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ show: false })
win.once('ready-to-show', () => {
win.show()
})

このイベントは通常、did-finish-load イベントの後に発行されますが、多くのリモートリソースを含むページでは、did-finish-load イベントの前に発行される場合があります。

このイベントを使用すると、show が false であっても、レンダラーが「可視」と見なされ、描画されることに注意してください。paintWhenInitiallyHidden: false を使用している場合、このイベントは発生しません。

backgroundColor プロパティを設定する

複雑なアプリの場合、ready-to-show イベントの発行が遅すぎて、アプリの動作が遅く感じられる場合があります。この場合は、ウィンドウをすぐに表示し、アプリの背景に近い backgroundColor を使用することをお勧めします。

const { BrowserWindow } = require('electron')

const win = new BrowserWindow({ backgroundColor: '#2e2c29' })
win.loadURL('https://github.com')

ready-to-show イベントを使用するアプリの場合でも、アプリをよりネイティブに感じさせるために backgroundColor を設定することをお勧めします。

有効な backgroundColor 値の例をいくつか示します。

const win = new BrowserWindow()
win.setBackgroundColor('hsl(230, 100%, 50%)')
win.setBackgroundColor('rgb(255, 145, 145)')
win.setBackgroundColor('#ff00a3')
win.setBackgroundColor('blueviolet')

これらの色の種類についての詳細は、win.setBackgroundColor の有効なオプションを参照してください。

親ウィンドウと子ウィンドウ

parent オプションを使用すると、子ウィンドウを作成できます。

const { BrowserWindow } = require('electron')

const top = new BrowserWindow()
const child = new BrowserWindow({ parent: top })
child.show()
top.show()

child ウィンドウは常に top ウィンドウの上に表示されます。

モーダルウィンドウは、親ウィンドウを無効にする子ウィンドウです。モーダルウィンドウを作成するには、parent オプションと modal オプションの両方を設定する必要があります。

const { BrowserWindow } = require('electron')

const top = new BrowserWindow()
const child = new BrowserWindow({ parent: top, modal: true, show: false })
child.loadURL('https://github.com')
child.once('ready-to-show', () => {
child.show()
})

ページの可視性

Page Visibility API は次のように動作します。

  • すべてのプラットフォームで、可視性状態はウィンドウが非表示/最小化されているかどうかを追跡します。
  • さらに、macOS では、可視性状態はウィンドウのオクルージョン状態も追跡します。ウィンドウが別のウィンドウによってオクルージョン(完全に覆われている)されている場合、可視性状態は hidden になります。他のプラットフォームでは、ウィンドウが最小化されているか、win.hide() で明示的に非表示になっている場合にのみ、可視性状態は hidden になります。
  • show: falseBrowserWindow が作成された場合、ウィンドウは実際には非表示になっているにもかかわらず、初期の可視性状態は visible になります。
  • backgroundThrottling が無効になっている場合、ウィンドウが最小化、オクルージョン、または非表示になっている場合でも、可視性状態は visible のままになります。

消費電力を最小限に抑えるために、可視性状態が hidden の場合は、コストのかかる操作を一時停止することをお勧めします。

プラットフォームの注意事項

  • macOS では、モーダルウィンドウは親ウィンドウに添付されたシートとして表示されます。
  • macOS では、親ウィンドウが移動すると子ウィンドウは親ウィンドウとの相対位置を維持しますが、Windows および Linux では子ウィンドウは移動しません。
  • Linux では、モーダルウィンドウのタイプが dialog に変更されます。
  • Linux では、多くのデスクトップ環境がモーダルウィンドウの非表示をサポートしていません。

クラス: BrowserWindow extends BaseWindow

ブラウザーウィンドウを作成および制御します。

プロセス: メイン

BrowserWindow は、EventEmitter です。

options で設定されたネイティブプロパティを使用して、新しい BrowserWindow を作成します。

new BrowserWindow([options])

  • options BrowserWindowConstructorOptions (オプション)
    • webPreferences WebPreferences (オプション) - Webページの機能の設定。
      • devTools boolean (オプション) - DevTools を有効にするかどうか。false に設定すると、DevTools を開くために BrowserWindow.webContents.openDevTools() を使用できません。デフォルトは true です。
      • nodeIntegration boolean (オプション) - Node 統合を有効にするかどうか。デフォルトは false です。
      • nodeIntegrationInWorker boolean (オプション) - Web ワーカーで Node 統合を有効にするかどうか。デフォルトは false です。詳細については、マルチスレッドを参照してください。
      • nodeIntegrationInSubFrames boolean (オプション) - iframe や子ウィンドウなどのサブフレームで Node.js のサポートを有効にするための試験的なオプション。すべてのプリロードはすべての iframe に対してロードされます。process.isMainFrame を使用して、メインフレーム内か否かを判断できます。
      • preload string (オプション) - ページ内で他のスクリプトが実行される前にロードされるスクリプトを指定します。このスクリプトは、Node 統合がオンになっているかオフになっているかに関係なく、常に Node API にアクセスできます。値はスクリプトへの絶対ファイルパスである必要があります。Node 統合がオフになっている場合、プリロードスクリプトは Node グローバルシンボルをグローバルスコープに再度導入できます。例については、こちらを参照してください。
      • sandbox boolean (オプション) - 設定されている場合、これにより、ウィンドウに関連付けられたレンダラーがサンドボックス化され、Chromium OS レベルのサンドボックスと互換性があり、Node.js エンジンが無効になります。これは nodeIntegration オプションと同じではなく、プリロードスクリプトで利用できる API はより制限されます。オプションの詳細については、こちらを参照してください。
      • session Session (オプション) - ページで使用するセッションを設定します。Session オブジェクトを直接渡す代わりに、セッションのパーティション文字列を受け入れる partition オプションを使用することもできます。sessionpartition の両方が指定されている場合は、session が優先されます。デフォルトはデフォルトのセッションです。
      • partition string (オプション) - セッションのパーティション文字列に従って、ページで使用するセッションを設定します。partitionpersist: で始まる場合、ページは同じ partition を持つアプリ内のすべてのページで利用できる永続的なセッションを使用します。persist: 接頭辞がない場合、ページはインメモリセッションを使用します。同じ partition を割り当てることで、複数のページが同じセッションを共有できます。デフォルトはデフォルトのセッションです。
      • zoomFactor number (オプション) - ページのデフォルトのズームファクター。3.0300% を表します。デフォルトは 1.0 です。
      • javascript boolean (オプション) - JavaScript のサポートを有効にします。デフォルトは true です。
      • webSecurity boolean (オプション) - false の場合、同一生成元ポリシーが無効になり(通常は人によるテスト Web サイトで使用)、このオプションがユーザーによって設定されていない場合は、allowRunningInsecureContenttrue に設定されます。デフォルトは true です。
      • allowRunningInsecureContent boolean (オプション) - https ページが http URL から JavaScript、CSS、またはプラグインを実行できるようにします。デフォルトは false です。
      • images boolean (オプション) - イメージのサポートを有効にします。デフォルトは true です。
      • imageAnimationPolicy string (オプション) - イメージアニメーション(例:GIF)の実行方法を指定します。animateanimateOnce、または noAnimation を指定できます。デフォルトは animate です。
      • textAreasAreResizable boolean (オプション) - TextArea要素をリサイズ可能にするかどうか。デフォルトはtrueです。
      • webgl boolean (オプション) - WebGLサポートを有効にするかどうか。デフォルトはtrueです。
      • plugins boolean (オプション) - プラグインを有効にするかどうか。デフォルトはfalseです。
      • experimentalFeatures boolean (オプション) - Chromiumの実験的な機能を有効にするかどうか。デフォルトはfalseです。
      • scrollBounce boolean (オプション) macOS - macOSでスクロールバウンス(ゴムひも)効果を有効にするかどうか。デフォルトはfalseです。
      • enableBlinkFeatures string (オプション) - 有効にする機能の文字列をカンマ区切りで並べたリスト(例:CSSVariables,KeyboardEventKey)。サポートされている機能文字列の完全なリストは、RuntimeEnabledFeatures.json5ファイルにあります。
      • disableBlinkFeatures string (オプション) - 無効にする機能の文字列をカンマ区切りで並べたリスト(例:CSSVariables,KeyboardEventKey)。サポートされている機能文字列の完全なリストは、RuntimeEnabledFeatures.json5ファイルにあります。
      • defaultFontFamily Object (オプション) - font-family のデフォルトフォントを設定します。
        • standard string (オプション) - デフォルトはTimes New Romanです。
        • serif string (オプション) - デフォルトはTimes New Romanです。
        • sansSerif string (オプション) - デフォルトはArialです。
        • monospace string (オプション) - デフォルトはCourier Newです。
        • cursive string (オプション) - デフォルトはScriptです。
        • fantasy string (オプション) - デフォルトはImpactです。
        • math string (オプション) - デフォルトはLatin Modern Mathです。
      • defaultFontSize Integer (オプション) - デフォルトは16です。
      • defaultMonospaceFontSize Integer (オプション) - デフォルトは13です。
      • minimumFontSize Integer (オプション) - デフォルトは0です。
      • defaultEncoding string (オプション) - デフォルトはISO-8859-1です。
      • backgroundThrottling boolean (オプション) - ページがバックグラウンドになったときにアニメーションとタイマーを抑制するかどうか。これはPage Visibility APIにも影響します。単一のbrowserWindowに表示される少なくとも1つのwebContentsbackgroundThrottlingが無効になっている場合、フレームはウィンドウ全体およびそれによって表示される他のwebContentsに対して描画およびスワップされます。デフォルトはtrueです。
      • offscreen boolean (オプション) - ブラウザウィンドウのオフスクリーンレンダリングを有効にするかどうか。デフォルトはfalseです。詳細はオフスクリーンレンダリングのチュートリアルを参照してください。
      • contextIsolation boolean (オプション) - Electron APIと指定されたpreloadスクリプトを別々のJavaScriptコンテキストで実行するかどうか。デフォルトはtrueです。preloadスクリプトが実行されるコンテキストは、独自の専用のdocumentwindowグローバル変数、および独自のJavaScript組み込みセット(ArrayObjectJSONなど)へのアクセスのみを持ち、これらはすべてロードされたコンテンツからは見えません。Electron APIはpreloadスクリプトでのみ利用可能であり、ロードされたページでは利用できません。このオプションは、ロードされたコンテンツがpreloadスクリプトや使用されているElectron APIを改ざんできないようにするために、潜在的に信頼できないリモートコンテンツをロードする場合に使用する必要があります。このオプションは、Chrome Content Scriptsで使用されているのと同じ手法を使用します。このコンテキストには、コンソールタブの上部にあるコンボボックスで「Electron Isolated Context」エントリを選択することで、開発ツールでアクセスできます。
      • webviewTag boolean (オプション) - <webview>タグを有効にするかどうか。デフォルトはfalseです。注意: <webview>用に構成されたpreloadスクリプトは、実行時にノード統合が有効になるため、リモート/信頼できないコンテンツが、悪意のある可能性があるpreloadスクリプトで<webview>タグを作成できないようにする必要があります。webContentswill-attach-webviewイベントを使用して、preloadスクリプトを削除したり、<webview>の初期設定を検証または変更したりできます。
      • additionalArguments string[] (オプション) - このアプリのレンダラープロセスでprocess.argvに追加される文字列のリスト。レンダラープロセスのプリロードスクリプトに少量のデータを渡すのに役立ちます。
      • safeDialogs boolean (オプション) - ブラウザスタイルの連続ダイアログ保護を有効にするかどうか。デフォルトはfalseです。
      • safeDialogsMessage string (オプション) - 連続ダイアログ保護がトリガーされたときに表示するメッセージ。定義されていない場合はデフォルトのメッセージが使用されます。現在、デフォルトのメッセージは英語であり、ローカライズされていないことに注意してください。
      • disableDialogs boolean (オプション) - ダイアログを完全に無効にするかどうか。safeDialogsをオーバーライドします。デフォルトはfalseです。
      • navigateOnDragDrop boolean (オプション) - ファイルまたはリンクをページにドラッグアンドドロップするとナビゲーションが発生するかどうか。デフォルトはfalseです。
      • autoplayPolicy string (オプション) - ウィンドウ内のコンテンツに適用する自動再生ポリシー。no-user-gesture-requireduser-gesture-requireddocument-user-activation-requiredのいずれかを使用できます。デフォルトはno-user-gesture-requiredです。
      • disableHtmlFullscreenWindowResize boolean (オプション) - HTMLフルスクリーンに入るときにウィンドウのサイズ変更を防止するかどうか。デフォルトはfalseです。
      • accessibleTitle string (オプション) - スクリーンリーダーなどのアクセシビリティツールにのみ提供される代替タイトル文字列。この文字列はユーザーには直接表示されません。
      • spellcheck boolean (オプション) - 組み込みのスペルチェッカーを有効にするかどうか。デフォルトはtrueです。
      • enableWebSQL boolean (オプション) - WebSQL APIを有効にするかどうか。デフォルトはtrueです。
      • v8CacheOptions string (オプション) - blinkが使用するv8コードキャッシュポリシーを強制します。使用できる値は次のとおりです。
        • none - コードキャッシュを無効にします
        • code - ヒューリスティックベースのコードキャッシュ
        • bypassHeatCheck - コードキャッシュのヒューリスティックをバイパスしますが、遅延コンパイルを使用します
        • bypassHeatCheckAndEagerCompile - 上記と同じですが、コンパイルはイージーです。デフォルトのポリシーはcodeです。
      • enablePreferredSizeMode boolean (オプション) - 推奨サイズモードを有効にするかどうか。推奨サイズとは、スクロールを必要とせずにドキュメントのレイアウトを含めるために必要な最小サイズです。これを有効にすると、推奨サイズが変更されたときにWebContentspreferred-size-changedイベントが発生します。デフォルトはfalseです。
      • transparent boolean (オプション) - ゲストページの背景の透明度を有効にするかどうか。デフォルトはtrueです。注意: ゲストページのテキストと背景色は、ルート要素のカラースキームから派生します。透明度が有効になっている場合、テキストの色はそれに応じて変化しますが、背景は透明のままになります。
    • paintWhenInitiallyHidden boolean (オプション) - showfalseで作成されたばかりの場合に、レンダラーをアクティブにするかどうか。show: falseで最初のロード時にdocument.visibilityStateが正しく機能するためには、これをfalseに設定する必要があります。これをfalseに設定すると、ready-to-showイベントは発生しません。デフォルトはtrueです。

インスタンスイベント

new BrowserWindowで作成されたオブジェクトは、次のイベントを発行します

注意: 一部のイベントは特定のオペレーティングシステムでのみ利用可能であり、そのようにラベル付けされています。

イベント: 'page-title-updated'

戻り値

  • event Event
  • title string
  • explicitSet boolean

ドキュメントのタイトルが変更されたときに発行され、event.preventDefault()を呼び出すと、ネイティブウィンドウのタイトルが変更されるのを防ぎます。explicitSetは、タイトルがファイルURLから合成された場合はfalseです。

イベント: 'close'

戻り値

  • event Event

ウィンドウが閉じられるときに発行されます。DOMのbeforeunloadイベントとunloadイベントの前に発行されます。event.preventDefault()を呼び出すと、閉じることがキャンセルされます。

通常、beforeunloadハンドラーを使用して、ウィンドウを閉じるかどうかを決定します。これは、ウィンドウがリロードされたときにも呼び出されます。Electronでは、undefined以外の値を返すと、閉じることがキャンセルされます。例:

window.onbeforeunload = (e) => {
console.log('I do not want to be closed')

// Unlike usual browsers that a message box will be prompted to users, returning
// a non-void value will silently cancel the close.
// It is recommended to use the dialog API to let the user confirm closing the
// application.
e.returnValue = false
}

注意: window.onbeforeunload = handlerwindow.addEventListener('beforeunload', handler)の動作には微妙な違いがあります。Electron内では前者の動作の方が一貫性があるため、値を返すだけでなく、常にevent.returnValueを明示的に設定することをお勧めします。

イベント: 'closed'

ウィンドウが閉じられたときに発行されます。このイベントを受け取った後は、ウィンドウへの参照を削除し、それ以上使用しないようにする必要があります。

イベント: 'session-end' Windows

強制シャットダウン、マシンの再起動、またはセッションのログオフによってウィンドウセッションが終了しようとしているときに発行されます。

イベント: 'unresponsive'

Webページが応答しなくなったときに発行されます。

イベント: 'responsive'

応答しなくなったWebページが再び応答するようになったときに発行されます。

イベント: 'blur'

ウィンドウがフォーカスを失ったときに発行されます。

イベント: 'focus'

ウィンドウがフォーカスを取得したときに発生します。

イベント: 'show'

ウィンドウが表示されたときに発生します。

イベント: 'hide'

ウィンドウが非表示になったときに発生します。

イベント: 'ready-to-show'

Webページが(表示されていない状態で)レンダリングされ、視覚的なちらつきなしにウィンドウを表示できるようになったときに発生します。

このイベントを使用すると、show が false であっても、レンダラーが「可視」と見なされ、描画されることに注意してください。paintWhenInitiallyHidden: false を使用している場合、このイベントは発生しません。

イベント: 'maximize'

ウィンドウが最大化されたときに発生します。

イベント: 'unmaximize'

ウィンドウが最大化状態から抜けたときに発生します。

イベント: 'minimize'

ウィンドウが最小化されたときに発生します。

イベント: 'restore'

ウィンドウが最小化状態から復元されたときに発生します。

イベント: 'will-resize' macOS Windows

戻り値

  • event Event
  • newBounds Rectangle - ウィンドウがリサイズされるサイズ。
  • details オブジェクト
    • edge (string) - リサイズのためにドラッグされているウィンドウの端。bottomleftrighttop-lefttop-rightbottom-left、または bottom-right のいずれかになります。

ウィンドウがリサイズされる前に発生します。event.preventDefault() を呼び出すと、ウィンドウのリサイズが阻止されます。

これはウィンドウが手動でリサイズされる場合にのみ発生することに注意してください。setBounds/setSize でウィンドウをリサイズしても、このイベントは発生しません。

edge オプションの可能な値と動作は、プラットフォームによって異なります。可能な値は次のとおりです。

  • Windows では、可能な値は bottomtopleftrighttop-lefttop-rightbottom-leftbottom-right です。
  • macOS では、可能な値は bottomright です。
    • bottom は、垂直方向のリサイズを示すために使用されます。
    • right は、水平方向のリサイズを示すために使用されます。

イベント: 'resize'

ウィンドウがリサイズされた後に発生します。

イベント: 'resized' macOS Windows

ウィンドウのリサイズが完了したときに1回発生します。

これは通常、ウィンドウが手動でリサイズされたときに発生します。macOS では、setBounds/setSize でウィンドウをリサイズし、animate パラメータを true に設定した場合も、リサイズが完了するとこのイベントが1回発生します。

イベント: 'will-move' macOS Windows

戻り値

  • event Event
  • newBounds Rectangle - ウィンドウが移動される場所。

ウィンドウが移動される前に発生します。Windows では、event.preventDefault() を呼び出すと、ウィンドウの移動が阻止されます。

これはウィンドウが手動で移動される場合にのみ発生することに注意してください。setPosition/setBounds/center でウィンドウを移動しても、このイベントは発生しません。

イベント: 'move'

ウィンドウが新しい位置に移動されているときに発生します。

イベント: 'moved' macOS Windows

ウィンドウが新しい位置に移動したときに1回発生します。

注意: macOS では、このイベントは move のエイリアスです。

イベント: 'enter-full-screen'

ウィンドウがフルスクリーン状態になったときに発生します。

イベント: 'leave-full-screen'

ウィンドウがフルスクリーン状態から抜けたときに発生します。

イベント: 'enter-html-full-screen'

HTML APIによってトリガーされたフルスクリーン状態になったときに発生します。

イベント: 'leave-html-full-screen'

HTML APIによってトリガーされたフルスクリーン状態から抜けたときに発生します。

イベント: 'always-on-top-changed'

戻り値

  • event Event
  • isAlwaysOnTop ブール値

ウィンドウが常に他のウィンドウの上に表示されるように設定または設定解除されたときに発生します。

イベント: 'app-command' Windows Linux

戻り値

  • event Event
  • command 文字列

アプリ コマンドが呼び出されたときに発生します。これらは通常、キーボードのメディアキーまたはブラウザのコマンド、および Windows の一部のマウスに組み込まれている「戻る」ボタンに関連しています。

コマンドは小文字に変換され、アンダースコアはハイフンに置き換えられ、APPCOMMAND_ プレフィックスが取り除かれます。例: APPCOMMAND_BROWSER_BACKWARDbrowser-backward として発生します。

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()
win.on('app-command', (e, cmd) => {
// Navigate the window back when the user hits their mouse back button
if (cmd === 'browser-backward' && win.webContents.canGoBack()) {
win.webContents.goBack()
}
})

Linux では、次のアプリ コマンドが明示的にサポートされています。

  • browser-backward
  • browser-forward

イベント: 'swipe' macOS

戻り値

  • event Event
  • direction 文字列

3本指のスワイプで発生します。可能な方向は uprightdownleft です。

このイベントの基盤となるメソッドは、画面上のコンテンツがスワイプに合わせて移動しない、古い macOS スタイルのトラックパッド スワイプを処理するために構築されています。ほとんどの macOS トラックパッドは、この種のスワイプを許可するように構成されなくなっているため、正しく発生させるためには、システム環境設定 > トラックパッド > その他のジェスチャ の「ページ間をスワイプ」の設定を「2本または3本の指でスワイプ」に設定する必要があります。

イベント: 'rotate-gesture' macOS

戻り値

  • event Event
  • rotation Float

トラックパッドの回転ジェスチャで発生します。回転ジェスチャが終了するまで継続的に発生します。各発生における rotation 値は、最後の発生からの回転角度(度単位)です。回転ジェスチャの最後の発生イベントは常に値 0 になります。反時計回りの回転値は正、時計回りの回転値は負です。

イベント: 'sheet-begin' macOS

ウィンドウがシートを開いたときに発生します。

イベント: 'sheet-end' macOS

ウィンドウがシートを閉じたときに発生します。

イベント: 'new-window-for-tab' macOS

ネイティブの新しいタブボタンがクリックされたときに発生します。

イベント: 'system-context-menu' Windows

戻り値

  • event Event
  • point Point - コンテキストメニューがトリガーされた画面座標。

システム コンテキスト メニューがウィンドウでトリガーされたときに発生します。これは通常、ユーザーがウィンドウの非クライアント領域を右クリックした場合にのみトリガーされます。これは、ウィンドウのタイトルバー、またはフレームレス ウィンドウで -webkit-app-region: drag として宣言した領域です。

event.preventDefault() を呼び出すと、メニューの表示が阻止されます。

静的メソッド

BrowserWindow クラスには、次の静的メソッドがあります。

BrowserWindow.getAllWindows()

BrowserWindow[] を返します - 開いているすべてのブラウザウィンドウの配列。

BrowserWindow.getFocusedWindow()

BrowserWindow | null を返します - このアプリケーションでフォーカスされているウィンドウ。それ以外の場合は null を返します。

BrowserWindow.fromWebContents(webContents)

BrowserWindow | null を返します - 指定された webContents を所有するウィンドウ。または、コンテンツがウィンドウによって所有されていない場合は null を返します。

BrowserWindow.fromBrowserView(browserView) 非推奨

注意 BrowserView クラスは非推奨となり、新しい WebContentsView クラスに置き換えられました。

BrowserWindow | null を返します - 指定された browserView を所有するウィンドウ。指定されたビューがどのウィンドウにもアタッチされていない場合は null を返します。

BrowserWindow.fromId(id)

  • id 整数

BrowserWindow | null を返します - 指定された id を持つウィンドウ。

インスタンス プロパティ

new BrowserWindow で作成されたオブジェクトには、次のプロパティがあります。

const { BrowserWindow } = require('electron')
// In this example `win` is our instance
const win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('https://github.com')

win.webContents 読み取り専用

このウィンドウが所有する WebContents オブジェクト。すべての Web ページ関連のイベントと操作は、これを介して行われます。

そのメソッドとイベントについては、webContents のドキュメントを参照してください。

win.id 読み取り専用

ウィンドウの一意の ID を表す Integer プロパティ。各 ID は、Electron アプリケーション全体のすべての BrowserWindow インスタンス間で一意です。

win.tabbingIdentifier macOS 読み取り専用

BrowserWindow コンストラクタに渡された tabbingIdentifier と同じ string (オプション) プロパティ。または、設定されていない場合は undefined

win.autoHideMenuBar

ウィンドウのメニューバーを自動的に隠すかどうかを決定するbooleanプロパティです。設定すると、メニューバーはユーザーがAltキーを1回押したときのみ表示されます。

メニューバーがすでに表示されている場合、このプロパティをtrueに設定しても、すぐに非表示にはなりません。

win.simpleFullScreen

ウィンドウがシンプル(Lion以前の)フルスクリーンモードであるかどうかを決定するbooleanプロパティです。

win.fullScreen

ウィンドウがフルスクリーンモードであるかどうかを決定するbooleanプロパティです。

win.focusable Windows macOS

ウィンドウがフォーカス可能かどうかを決定するbooleanプロパティです。

win.visibleOnAllWorkspaces macOS Linux

ウィンドウがすべてのワークスペースに表示されるかどうかを決定するbooleanプロパティです。

注意: Windowsでは常にfalseを返します。

win.shadow

ウィンドウに影があるかどうかを決定するbooleanプロパティです。

win.menuBarVisible Windows Linux

メニューバーを表示するかどうかを決定するbooleanプロパティです。

注意: メニューバーが自動的に隠れる設定になっている場合でも、ユーザーはAltキーを1回押すことでメニューバーを表示できます。

win.kiosk

ウィンドウがキオスクモードであるかどうかを決定するbooleanプロパティです。

win.documentEdited macOS

ウィンドウのドキュメントが編集されたかどうかを指定するbooleanプロパティです。

trueに設定すると、タイトルバーのアイコンが灰色になります。

win.representedFilename macOS

ウィンドウが表すファイルのパス名を決定するstringプロパティで、ファイルのアイコンがウィンドウのタイトルバーに表示されます。

win.title

ネイティブウィンドウのタイトルを決定するstringプロパティです。

注意: Webページのタイトルは、ネイティブウィンドウのタイトルとは異なる場合があります。

win.minimizable macOS Windows

ユーザーが手動でウィンドウを最小化できるかどうかを決定するbooleanプロパティです。

Linuxでは、セッターはno-opですが、ゲッターはtrueを返します。

win.maximizable macOS Windows

ユーザーが手動でウィンドウを最大化できるかどうかを決定するbooleanプロパティです。

Linuxでは、セッターはno-opですが、ゲッターはtrueを返します。

win.fullScreenable

最大化/ズームウィンドウボタンがフルスクリーンモードを切り替えるか、ウィンドウを最大化するかを決定するbooleanプロパティです。

win.resizable

ユーザーが手動でウィンドウのサイズを変更できるかどうかを決定するbooleanプロパティです。

win.closable macOS Windows

ユーザーが手動でウィンドウを閉じることができるかどうかを決定するbooleanプロパティです。

Linuxでは、セッターはno-opですが、ゲッターはtrueを返します。

win.movable macOS Windows

ユーザーがウィンドウを移動できるかどうかを決定するbooleanプロパティです。

Linuxでは、セッターはno-opですが、ゲッターはtrueを返します。

win.excludedFromShownWindowsMenu macOS

ウィンドウをアプリケーションのWindowsメニューから除外するかどうかを決定するbooleanプロパティです。デフォルトではfalseです。

const win = new BrowserWindow({ height: 600, width: 600 })

const template = [
{
role: 'windowmenu'
}
]

win.excludedFromShownWindowsMenu = true

const menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu)

win.accessibleTitle

スクリーンリーダーなどのアクセシビリティツールのみに提供される代替タイトルを定義するstringプロパティです。この文字列はユーザーには直接表示されません。

インスタンスメソッド

new BrowserWindowで作成されたオブジェクトには、次のインスタンスメソッドがあります

注意: 一部のメソッドは特定のオペレーティングシステムでのみ利用可能で、そのようにラベル付けされています。

win.destroy()

ウィンドウを強制的に閉じます。Webページに対してunloadイベントとbeforeunloadイベントは発行されず、このウィンドウに対してcloseイベントも発行されませんが、closedイベントが発行されることは保証されます。

win.close()

ウィンドウを閉じようとします。これは、ユーザーがウィンドウの閉じるボタンを手動でクリックするのと同じ効果があります。ただし、Webページはクローズをキャンセルする可能性があります。closeイベントを参照してください。

win.focus()

ウィンドウにフォーカスを当てます。

win.blur()

ウィンドウからフォーカスを削除します。

win.isFocused()

booleanを返します - ウィンドウがフォーカスされているかどうか。

win.isDestroyed()

booleanを返します - ウィンドウが破棄されたかどうか。

win.show()

ウィンドウを表示し、フォーカスを当てます。

win.showInactive()

ウィンドウを表示しますが、フォーカスは当てません。

win.hide()

ウィンドウを非表示にします。

win.isVisible()

booleanを返します - ウィンドウがアプリのフォアグラウンドでユーザーに表示されているかどうか。

win.isModal()

booleanを返します - 現在のウィンドウがモーダルウィンドウであるかどうか。

win.maximize()

ウィンドウを最大化します。これは、まだ表示されていない場合はウィンドウを表示します(ただし、フォーカスは当てません)。

win.unmaximize()

ウィンドウを最大化前の状態に戻します。

win.isMaximized()

booleanを返します - ウィンドウが最大化されているかどうか。

win.minimize()

ウィンドウを最小化します。一部のプラットフォームでは、最小化されたウィンドウはDockに表示されます。

win.restore()

ウィンドウを最小化状態から前の状態に戻します。

win.isMinimized()

booleanを返します - ウィンドウが最小化されているかどうか。

win.setFullScreen(flag)

  • flag boolean

ウィンドウをフルスクリーンモードにするかどうかを設定します。

注意: macOSでは、フルスクリーンの切り替えは非同期的に行われます。フルスクリーン状態に依存する操作を行う場合は、'enter-full-screen'または'leave-full-screen'イベントを使用してください。

win.isFullScreen()

booleanを返します - ウィンドウがフルスクリーンモードであるかどうか。

注意: macOSでは、フルスクリーンの切り替えは非同期的に行われます。BrowserWindowのフルスクリーンステータスをクエリする場合は、'enter-full-screen'または'leave-full-screen'イベントのいずれかが発行されていることを確認する必要があります。

win.setSimpleFullScreen(flag) macOS

  • flag boolean

シンプルフルスクリーンモードに入るか、または抜けます。

シンプルフルスクリーンモードは、Lion (10.7) より前のmacOSのバージョンで見られたネイティブのフルスクリーン動作をエミュレートします。

win.isSimpleFullScreen() macOS

booleanを返します - ウィンドウがシンプル(Lion以前の)フルスクリーンモードであるかどうか。

win.isNormal()

boolean を返します - ウィンドウが通常の状態(最大化、最小化、フルスクリーンモードではない)であるかどうか。

win.setAspectRatio(aspectRatio[, extraSize])

  • aspectRatio Float - コンテンツビューの一部で維持するアスペクト比。
  • extraSize Size (オプション) macOS - アスペクト比の維持時に含めない追加のサイズ。

これにより、ウィンドウはアスペクト比を維持します。追加サイズを使用すると、開発者はアスペクト比の計算に含まれないピクセル単位で指定されたスペースを持つことができます。このAPIは、ウィンドウのサイズとコンテンツサイズの差を既に考慮に入れています。

HDビデオプレーヤーと関連コントロールを備えた通常のウィンドウを考えてみましょう。おそらく、左端に15ピクセルのコントロール、右端に25ピクセルのコントロール、プレーヤーの下に50ピクセルのコントロールがあります。プレーヤー自体で16:9のアスペクト比(HD @ 1920x1080の標準アスペクト比)を維持するためには、16/9と{ width:40、height:50 }の引数を指定してこの関数を呼び出します。2番目の引数は、コンテンツビュー内の余分な幅と高さがどこにあるかは気にしません。それらが存在することだけを気にします。コンテンツビュー全体の余分な幅と高さの領域を合計してください。

ウィンドウがwin.setSizeなどのAPIを使用してプログラムでサイズ変更された場合、アスペクト比は尊重されません。

アスペクト比をリセットするには、aspectRatioの値として0を渡します。win.setAspectRatio(0)

win.setBackgroundColor(backgroundColor)

  • backgroundColor string - 16進数、RGB、RGBA、HSL、HSLA、または名前付きCSSカラー形式の色。16進数タイプの場合、アルファチャネルはオプションです。

有効なbackgroundColor値の例

  • 16進数
    • #fff (短縮形RGB)
    • #ffff (短縮形ARGB)
    • #ffffff (RGB)
    • #ffffffff (ARGB)
  • RGB
    • rgb\(([\d]+),\s*([\d]+),\s*([\d]+)\)
      • 例:rgb(255, 255, 255)
  • RGBA
    • rgba\(([\d]+),\s*([\d]+),\s*([\d]+),\s*([\d.]+)\)
      • 例:rgba(255, 255, 255, 1.0)
  • HSL
    • hsl\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%\)
      • 例:hsl(200, 20%, 50%)
  • HSLA
    • hsla\((-?[\d.]+),\s*([\d.]+)%,\s*([\d.]+)%,\s*([\d.]+)\)
      • 例:hsla(200, 20%, 50%, 0.5)
  • 色名
    • オプションはSkParseColor.cppにリストされています
    • CSS Color Module Level 3キーワードに似ていますが、大文字と小文字が区別されます。
      • 例:bluevioletまたはred

ウィンドウの背景色を設定します。backgroundColorの設定を参照してください。

win.previewFile(path[, displayName]) macOS

  • path string - QuickLookでプレビューするファイルの絶対パス。これは、Quick Lookがパス上のファイル名とファイル拡張子を使用して、開くファイルのコンテンツタイプを決定するため、重要です。
  • displayName string(オプション) - Quick Lookモーダルビューに表示するファイルの名前。これは純粋に視覚的なものであり、ファイルのコンテンツタイプには影響しません。デフォルトはpathです。

Quick Lookを使用して、指定されたパスにあるファイルをプレビューします。

win.closeFilePreview() macOS

現在開いているQuick Lookパネルを閉じます。

win.setBounds(bounds[, animate])

  • bounds Partial<Rectangle>
  • animate boolean (オプション) macOS

ウィンドウのサイズを変更し、指定された境界に移動します。指定されていないプロパティは、デフォルトで現在の値になります。

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

// set all bounds properties
win.setBounds({ x: 440, y: 225, width: 800, height: 600 })

// set a single bounds property
win.setBounds({ width: 100 })

// { x: 440, y: 225, width: 100, height: 600 }
console.log(win.getBounds())

注:macOSでは、y座標の値はトレイの高さよりも小さくすることはできません。トレイの高さは時間の経過とともに変化しており、オペレーティングシステムによって異なりますが、20〜40pxの間です。トレイの高さよりも小さい値を渡すと、トレイに接するウィンドウになります。

win.getBounds()

Rectangleを返します - ウィンドウのboundsObjectとして。

注:macOSでは、返されるy座標の値は、最小でもトレイの高さになります。たとえば、トレイの高さが38の場合、win.setBounds({ x: 25, y: 20, width: 800, height: 600 })を呼び出すと、win.getBounds(){ x: 25, y: 38, width: 800, height: 600 }を返します。

win.getBackgroundColor()

stringを返します - ウィンドウの背景色を16進数(#RRGGBB)形式で取得します。

backgroundColorの設定を参照してください。

注:アルファ値は、赤、緑、青の値とともに返されません

win.setContentBounds(bounds[, animate])

  • bounds Rectangle
  • animate boolean (オプション) macOS

ウィンドウのクライアント領域(例:Webページ)のサイズを変更し、指定された境界に移動します。

win.getContentBounds()

Rectangleを返します - ウィンドウのクライアント領域のboundsObjectとして。

win.getNormalBounds()

Rectangleを返します - 通常状態のウィンドウの境界を含みます。

注:ウィンドウの現在の状態(最大化、最小化、またはフルスクリーン)に関係なく、この関数は常に通常状態のウィンドウの位置とサイズを返します。通常状態では、getBoundsとgetNormalBoundsは同じRectangleを返します。

win.setEnabled(enable)

  • enable boolean

ウィンドウを無効または有効にします。

win.isEnabled()

booleanを返します - ウィンドウが有効かどうか。

win.setSize(width, height[, animate])

  • width Integer
  • height Integer
  • animate boolean (オプション) macOS

ウィンドウのサイズをwidthheightに変更します。widthまたはheightが設定された最小サイズ制約を下回っている場合、ウィンドウは最小サイズにスナップします。

win.getSize()

Integer[]を返します - ウィンドウの幅と高さを含みます。

win.setContentSize(width, height[, animate])

  • width Integer
  • height Integer
  • animate boolean (オプション) macOS

ウィンドウのクライアント領域(例:Webページ)のサイズをwidthheightに変更します。

win.getContentSize()

Integer[]を返します - ウィンドウのクライアント領域の幅と高さを含みます。

win.setMinimumSize(width, height)

  • width Integer
  • height Integer

ウィンドウの最小サイズをwidthheightに設定します。

win.getMinimumSize()

Integer[]を返します - ウィンドウの最小幅と高さを含みます。

win.setMaximumSize(width, height)

  • width Integer
  • height Integer

ウィンドウの最大サイズをwidthheightに設定します。

win.getMaximumSize()

Integer[]を返します - ウィンドウの最大幅と高さを含みます。

win.setResizable(resizable)

  • resizable boolean

ウィンドウをユーザーが手動でサイズ変更できるかどうかを設定します。

win.isResizable()

booleanを返します - ウィンドウをユーザーが手動でサイズ変更できるかどうか。

win.setMovable(movable) macOS Windows

  • movable boolean

ユーザーがウィンドウを移動できるかどうかを設定します。Linuxでは何も行いません。

win.isMovable() macOS Windows

booleanを返します - ユーザーがウィンドウを移動できるかどうか。

Linuxでは常にtrueを返します。

win.setMinimizable(minimizable) macOS Windows

  • minimizable boolean

ユーザーがウィンドウを手動で最小化できるかどうかを設定します。Linuxでは何も行いません。

win.isMinimizable() macOS Windows

booleanを返します - ユーザーがウィンドウを手動で最小化できるかどうか。

Linuxでは常にtrueを返します。

win.setMaximizable(maximizable) macOS Windows

  • maximizable boolean

ユーザーが手動でウィンドウを最大化できるかどうかを設定します。Linuxでは何も行いません。

win.isMaximizable() macOS Windows

boolean を返します - ユーザーが手動でウィンドウを最大化できるかどうか。

Linuxでは常にtrueを返します。

win.setFullScreenable(fullscreenable)

  • fullscreenable boolean

最大化/ズームウィンドウボタンがフルスクリーンモードを切り替えるか、ウィンドウを最大化するかを設定します。

win.isFullScreenable()

boolean を返します - 最大化/ズームウィンドウボタンがフルスクリーンモードを切り替えるか、ウィンドウを最大化するかどうか。

win.setClosable(closable) macOS Windows

  • closable boolean

ユーザーが手動でウィンドウを閉じることができるかどうかを設定します。Linuxでは何も行いません。

win.isClosable() macOS Windows

boolean を返します - ユーザーが手動でウィンドウを閉じることができるかどうか。

Linuxでは常にtrueを返します。

win.setHiddenInMissionControl(hidden) macOS

  • hidden boolean

ユーザーがミッションコントロールに切り替えたときにウィンドウを非表示にするかどうかを設定します。

win.isHiddenInMissionControl() macOS

boolean を返します - ユーザーがミッションコントロールに切り替えたときにウィンドウを非表示にするかどうか。

win.setAlwaysOnTop(flag[, level][, relativeLevel])

  • flag boolean
  • level string (オプション) macOS Windows - 値には、normalfloatingtorn-off-menumodal-panelmain-menustatuspop-up-menuscreen-saver、および dock (非推奨) があります。flag が true の場合、デフォルトは floating です。level は、フラグが false の場合は normal にリセットされます。floating から status までを含めて、ウィンドウはmacOSではDockの下、Windowsではタスクバーの下に配置されることに注意してください。pop-up-menu からそれより高いレベルでは、macOSではDockの上、Windowsではタスクバーの上に表示されます。詳細については、macOSドキュメントを参照してください。
  • relativeLevel Integer (オプション) macOS - 指定された level に対して、このウィンドウを何層高く設定するかを指定します。デフォルトは 0 です。Appleは、screen-saver より1層以上高くレベルを設定することを推奨していません。

ウィンドウを常に他のウィンドウの上に表示するかどうかを設定します。これを設定した後でも、ウィンドウはフォーカスできないツールボックスウィンドウではなく、通常のウィンドウのままです。

win.isAlwaysOnTop()

boolean を返します - ウィンドウが常に他のウィンドウの上に表示されるかどうか。

win.moveAbove(mediaSourceId)

  • mediaSourceId string - DesktopCapturerSource の id 形式のウィンドウ ID。たとえば "window:1869:0" のようになります。

zオーダーの意味で、ソースウィンドウの上にウィンドウを移動します。mediaSourceId がウィンドウタイプではない場合、またはウィンドウが存在しない場合は、このメソッドはエラーをスローします。

win.moveTop()

フォーカスに関係なく、ウィンドウを最上位(zオーダー)に移動します。

win.center()

ウィンドウを画面の中央に移動します。

win.setPosition(x, y[, animate])

  • x Integer
  • y Integer
  • animate boolean (オプション) macOS

ウィンドウを xy に移動します。

win.getPosition()

Integer[] を返します - ウィンドウの現在の位置が含まれています。

win.setTitle(title)

  • title string

ネイティブウィンドウのタイトルを title に変更します。

win.getTitle()

string を返します - ネイティブウィンドウのタイトル。

注意: Webページのタイトルは、ネイティブウィンドウのタイトルとは異なる場合があります。

win.setSheetOffset(offsetY[, offsetX]) macOS

  • offsetY Float
  • offsetX Float (オプション)

macOSでのシートの添付ポイントを変更します。デフォルトでは、シートはウィンドウフレームのすぐ下に添付されますが、HTMLでレンダリングされたツールバーの下に表示したい場合があります。例えば

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

const toolbarRect = document.getElementById('toolbar').getBoundingClientRect()
win.setSheetOffset(toolbarRect.height)

win.flashFrame(flag)

履歴
  • flag boolean

ユーザーの注意を引くために、ウィンドウの点滅を開始または停止します。

win.setSkipTaskbar(skip) macOS Windows

  • skip boolean

ウィンドウをタスクバーに表示しないようにします。

win.setKiosk(flag)

  • flag boolean

キオスクモードを開始または終了します。

win.isKiosk()

boolean を返します - ウィンドウがキオスクモードであるかどうか。

win.isTabletMode() Windows

boolean を返します - ウィンドウがWindows 10タブレットモードであるかどうか。

Windows 10ユーザーはPCをタブレットとして使用できるため、このモードでは、アプリはタイトルバーを拡大したり、タイトルバーボタンを非表示にするなど、タブレット用にUIを最適化することができます。

このAPIは、ウィンドウがタブレットモードであるかどうかを返し、resizeイベントを使用してタブレットモードへの変更をリッスンできます。

win.getMediaSourceId()

string を返します - DesktopCapturerSource の id 形式のウィンドウ ID。たとえば "window:1324:0" のようになります。

より正確には、形式は window:id:other_id です。ここで id は Windows では HWND、macOS では CGWindowID (uint64_t)、Linux では Window (unsigned long) です。other_id は、同じトップレベルウィンドウ内の Web コンテンツ(タブ)を識別するために使用されます。

win.getNativeWindowHandle()

Buffer を返します - ウィンドウのプラットフォーム固有のハンドル。

ハンドルのネイティブ型は、WindowsではHWND、macOSではNSView*、LinuxではWindow (unsigned long) です。

win.hookWindowMessage(message, callback) Windows

  • message Integer
  • callback Function
    • wParam Buffer - WndProcに提供されたwParam
    • lParam Buffer - WndProcに提供されたlParam

Windowsメッセージをフックします。callbackは、メッセージがWndProcで受信されたときに呼び出されます。

win.isWindowMessageHooked(message) Windows

  • message Integer

boolean を返します - メッセージがフックされているかどうかによって true または false

win.unhookWindowMessage(message) Windows

  • message Integer

ウィンドウメッセージのフックを解除します。

win.unhookAllWindowMessages() Windows

すべてのウィンドウメッセージのフックを解除します。

win.setRepresentedFilename(filename) macOS

  • filename string

ウィンドウが表すファイルのパス名を設定します。ファイルのアイコンがウィンドウのタイトルバーに表示されます。

win.getRepresentedFilename() macOS

string を返します - ウィンドウが表すファイルのパス名。

win.setDocumentEdited(edited) macOS

  • edited boolean

ウィンドウのドキュメントが編集されたかどうかを指定します。true に設定すると、タイトルバーのアイコンが灰色になります。

win.isDocumentEdited() macOS

boolean を返します - ウィンドウのドキュメントが編集されたかどうか。

win.focusOnWebView()

win.blurWebView()

win.capturePage([rect, opts])

  • rect Rectangle (任意) - キャプチャする範囲
  • opts Object (任意)
    • stayHidden boolean (任意) - ページを可視化せずに非表示のままにします。デフォルトはfalseです。
    • stayAwake boolean (任意) - システムをスリープさせずに起動状態を維持します。デフォルトはfalseです。

戻り値 Promise<NativeImage> - NativeImageで解決します。

rect内のページの画像をキャプチャします。rectを省略すると、可視ページ全体をキャプチャします。ページが非表示の場合、rectは空になることがあります。ページは、ブラウザウィンドウが非表示で、キャプチャカウントがゼロ以外の場合に可視と見なされます。ページを非表示のままにする場合は、stayHiddenをtrueに設定する必要があります。

win.loadURL(url[, options])

  • url string
  • options Object (任意)
    • httpReferrer (string | Referrer) (任意) - HTTPリファラーURL。
    • userAgent string (任意) - リクエストを発信するユーザーエージェント。
    • extraHeaders string (任意) - "\n"で区切られた追加ヘッダー。
    • postData (UploadRawData | UploadFile)[] (任意)
    • baseURLForDataURL string (任意) - data URLで読み込まれるファイルのベースURL(末尾にパス区切り文字付き)。これは、指定されたurlがデータURLで、他のファイルを読み込む必要がある場合にのみ必要です。

戻り値 Promise<void> - ページがロードを完了するとプロミスは解決し(did-finish-loadを参照)、ページのロードに失敗すると拒否されます(did-fail-loadを参照)。

webContents.loadURL(url[, options])と同じです。

urlは、リモートアドレス(例:http://)またはfile://プロトコルを使用したローカルHTMLファイルへのパスにすることができます。

ファイルURLが正しくフォーマットされるように、Nodeのurl.formatメソッドを使用することをお勧めします。

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

const url = require('url').format({
protocol: 'file',
slashes: true,
pathname: require('node:path').join(__dirname, 'index.html')
})

win.loadURL(url)

次の方法で、URLエンコードされたデータを使用してPOSTリクエストでURLをロードできます。

const { BrowserWindow } = require('electron')
const win = new BrowserWindow()

win.loadURL('http://localhost:8000/post', {
postData: [{
type: 'rawData',
bytes: Buffer.from('hello=world')
}],
extraHeaders: 'Content-Type: application/x-www-form-urlencoded'
})

win.loadFile(filePath[, options])

  • filePath string
  • options Object (任意)
    • query Record<string, string> (任意) - url.format()に渡されます。
    • search string (任意) - url.format()に渡されます。
    • hash string (任意) - url.format()に渡されます。

戻り値 Promise<void> - ページがロードを完了するとプロミスは解決し(did-finish-loadを参照)、ページのロードに失敗すると拒否されます(did-fail-loadを参照)。

webContents.loadFileと同じです。filePathは、アプリケーションのルートからの相対的なHTMLファイルへのパスである必要があります。詳細については、webContentsのドキュメントを参照してください。

win.reload()

webContents.reloadと同じです。

win.setMenu(menu) Linux Windows

  • menu Menu | null

menuをウィンドウのメニューバーとして設定します。

win.removeMenu() Linux Windows

ウィンドウのメニューバーを削除します。

win.setProgressBar(progress[, options])

  • progress Double
  • options Object (任意)
    • mode string Windows - プログレスバーのモード。nonenormalindeterminateerror、またはpausedにできます。

プログレスバーの進行状況を設定します。有効な範囲は[0、1.0]です。

progress < 0 の場合はプログレスバーを削除します。progress > 1 の場合は不定モードに変更します。

Linuxプラットフォームでは、Unityデスクトップ環境のみがサポートされています。package.jsondesktopNameフィールドに*.desktopファイル名を指定する必要があります。デフォルトでは、{app.name}.desktopと想定されます。

Windowsでは、モードを渡すことができます。許可される値は、nonenormalindeterminateerror、およびpausedです。モードを設定せずに(ただし有効な範囲内の値で)setProgressBarを呼び出すと、normalが想定されます。

win.setOverlayIcon(overlay, description) Windows

  • overlay NativeImage | null - タスクバーアイコンの右下隅に表示するアイコン。このパラメータがnullの場合、オーバーレイはクリアされます。
  • description string - アクセシビリティスクリーンリーダーに提供される説明

現在のタスクバーアイコンに16 x 16ピクセルのオーバーレイを設定します。通常、何らかのアプリケーションステータスを伝えたり、ユーザーに受動的に通知したりするために使用されます。

win.invalidateShadow() macOS

ウィンドウの影を無効にして、現在のウィンドウの形状に基づいて再計算されるようにします。

透明なBrowserWindowsは、macOSで視覚的なアーティファクトを残すことがあります。このメソッドは、たとえばアニメーションを実行するときに、これらのアーティファクトをクリアするために使用できます。

win.setHasShadow(hasShadow)

  • hasShadow boolean

ウィンドウに影を付けるかどうかを設定します。

win.hasShadow()

戻り値 boolean - ウィンドウに影があるかどうか。

win.setOpacity(opacity) Windows macOS

  • opacity number - 0.0(完全に透明)から1.0(完全に不透明)の間

ウィンドウの不透明度を設定します。Linuxでは、何も行いません。範囲外の数値は、[0, 1]の範囲にクランプされます。

win.getOpacity()

戻り値 number - 0.0(完全に透明)から1.0(完全に不透明)の間。Linuxでは、常に1を返します。

win.setShape(rects) Windows Linux 実験的

  • rects Rectangle[] - ウィンドウの形状を設定します。空のリストを渡すと、ウィンドウは長方形に戻ります。

ウィンドウの形状を設定すると、システムが描画とユーザーインタラクションを許可するウィンドウ内の領域が決まります。指定された領域の外側では、ピクセルは描画されず、マウスイベントは登録されません。領域外のマウスイベントは、そのウィンドウでは受信されず、ウィンドウの背後にあるものにフォールスルーします。

win.setThumbarButtons(buttons) Windows

戻り値 boolean - ボタンが正常に追加されたかどうか

タスクバーボタンレイアウトのウィンドウのサムネイル画像に、指定されたボタンのセットを持つサムネイルツールバーを追加します。サムネイルが正常に追加されたかどうかを示すbooleanオブジェクトを返します。

サムネイルツールバーのボタンの数は、スペースが限られているため、7以下にする必要があります。サムネイルツールバーをセットアップすると、プラットフォームの制限によりツールバーを削除できません。ただし、ボタンをクリアするために空の配列でAPIを呼び出すことができます。

buttonsは、Buttonオブジェクトの配列です。

  • Buttonオブジェクト
    • icon NativeImage - サムネイルツールバーに表示されるアイコン。
    • click Function
    • tooltip string (任意) - ボタンのツールチップのテキスト。
    • flags string[] (任意) - ボタンの特定の状態と動作を制御します。デフォルトでは、['enabled']です。

flagsは、次のstringを含むことができる配列です。

  • enabled - ボタンはアクティブで、ユーザーが利用できます。
  • disabled - ボタンは無効になっています。存在しますが、ユーザーのアクションに応答しないことを示す視覚的な状態があります。
  • dismissonclick - ボタンをクリックすると、サムネイルウィンドウがすぐに閉じます。
  • nobackground - ボタンの境界線を描画せず、画像のみを使用します。
  • hidden - ボタンはユーザーに表示されません。
  • noninteractive - ボタンは有効になっていますが、インタラクティブではありません。押されたボタンの状態は描画されません。この値は、ボタンが通知で使用されている場合に意図されています。

win.setThumbnailClip(region) Windows

  • region Rectangle - ウィンドウの領域

タスクバーでウィンドウにカーソルを合わせたときに表示されるサムネイル画像として表示するウィンドウの領域を設定します。空の領域({ x: 0, y: 0, width: 0, height: 0 })を指定することで、サムネイルをウィンドウ全体にリセットできます。

win.setThumbnailToolTip(toolTip) Windows

  • toolTip string

タスクバーのウィンドウサムネイルにカーソルを合わせたときに表示されるツールチップを設定します。

win.setAppDetails(options) Windows

  • options Object
    • appId string (任意) - ウィンドウのアプリケーションユーザーモデルID。設定する必要があります。そうしないと、他のオプションは効果がありません。
    • appIconPath string (任意) - ウィンドウの再起動アイコン
    • appIconIndex Integer (任意) - appIconPath内のアイコンのインデックス。appIconPathが設定されていない場合は無視されます。デフォルトは0です。
    • relaunchCommand string (オプション) - ウィンドウの 再起動コマンド
    • relaunchDisplayName string (オプション) - ウィンドウの 再起動表示名

ウィンドウのタスクバーボタンのプロパティを設定します。

注: relaunchCommandrelaunchDisplayName は常に一緒に設定する必要があります。どちらかのプロパティが設定されていない場合、どちらも使用されません。

win.showDefinitionForSelection() macOS

webContents.showDefinitionForSelection() と同じです。

win.setIcon(icon) Windows Linux

ウィンドウのアイコンを変更します。

win.setWindowButtonVisibility(visible) macOS

  • visible boolean

ウィンドウの信号機ボタンを表示するかどうかを設定します。

win.setAutoHideMenuBar(hide) Windows Linux

  • hide boolean

ウィンドウのメニューバーを自動的に隠すかどうかを設定します。設定すると、メニューバーはユーザーが単独のAltキーを押したときにのみ表示されます。

メニューバーが既に表示されている場合、setAutoHideMenuBar(true)を呼び出してもすぐに隠れることはありません。

win.isMenuBarAutoHide() Windows Linux

booleanを返します - メニューバーが自動的に非表示になるかどうか。

win.setMenuBarVisibility(visible) Windows Linux

  • visible boolean

メニューバーを表示するかどうかを設定します。メニューバーが自動非表示の場合、ユーザーは単独のAltキーを押すことでメニューバーを表示できます。

win.isMenuBarVisible() Windows Linux

booleanを返します - メニューバーが表示されているかどうか。

win.setVisibleOnAllWorkspaces(visible[, options]) macOS Linux

  • visible boolean
  • options Object (任意)
    • visibleOnFullScreen boolean (オプション) macOS - ウィンドウをフルスクリーンウィンドウの上に表示するかどうかを設定します。
    • skipTransformProcessType boolean (オプション) macOS - setVisibleOnAllWorkspaces を呼び出すと、正しい動作を保証するために、デフォルトでプロセスタイプが UIElementApplication と ForegroundApplication の間で変換されます。ただし、これにより、呼び出されるたびにウィンドウとドックが短時間非表示になります。ウィンドウがすでに UIElementApplication タイプの場合は、skipTransformProcessType に true を渡すことで、この変換をバイパスできます。

ウィンドウをすべてのワークスペースに表示するかどうかを設定します。

注: このAPIはWindowsでは何も行いません。

win.isVisibleOnAllWorkspaces() macOS Linux

booleanを返します - ウィンドウがすべてのワークスペースに表示されているかどうか。

注: このAPIはWindowsでは常にfalseを返します。

win.setIgnoreMouseEvents(ignore[, options])

  • ignore boolean
  • options Object (任意)
    • forward boolean (オプション) macOS Windows - trueの場合、マウス移動メッセージをChromiumに転送し、mouseleaveなどのマウス関連イベントを有効にします。ignoreがtrueの場合のみ使用されます。ignoreがfalseの場合、この値に関係なく転送は常に無効になります。

ウィンドウがすべてのマウスイベントを無視するようにします。

このウィンドウで発生したすべてのマウスイベントはこのウィンドウの下のウィンドウに渡されますが、このウィンドウにフォーカスがある場合、キーボードイベントは引き続き受信します。

win.setContentProtection(enable) macOS Windows

  • enable boolean

ウィンドウの内容が他のアプリによってキャプチャされるのを防ぎます。

macOSでは、NSWindowのsharingTypeをNSWindowSharingNoneに設定します。Windowsでは、WDA_EXCLUDEFROMCAPTUREを指定してSetWindowDisplayAffinityを呼び出します。Windows 10 バージョン 2004 以降では、ウィンドウはキャプチャから完全に削除され、古いバージョンの Windows では、WDA_MONITOR が適用され、黒いウィンドウをキャプチャするように動作します。

win.setFocusable(focusable) macOS Windows

  • focusable boolean

ウィンドウにフォーカスできるかどうかを変更します。

macOSでは、ウィンドウからフォーカスを削除しません。

win.isFocusable() macOS Windows

booleanを返します - ウィンドウにフォーカスできるかどうか。

win.setParentWindow(parent)

  • parent BrowserWindow | null

parentを現在のウィンドウの親ウィンドウとして設定し、nullを渡すと現在のウィンドウがトップレベルウィンドウになります。

win.getParentWindow()

BrowserWindow | nullを返します - 親ウィンドウ、または親がない場合はnull

win.getChildWindows()

BrowserWindow[]を返します - すべての子ウィンドウ。

win.setAutoHideCursor(autoHide) macOS

  • autoHide boolean

入力時にカーソルを隠すかどうかを制御します。

win.selectPreviousTab() macOS

ネイティブタブが有効になっており、ウィンドウに他のタブがある場合、前のタブを選択します。

win.selectNextTab() macOS

ネイティブタブが有効になっており、ウィンドウに他のタブがある場合、次のタブを選択します。

win.showAllTabs() macOS

ネイティブタブが有効になっているときに、タブの概要を表示または非表示にします。

win.mergeAllWindows() macOS

ネイティブタブが有効になっており、複数のウィンドウが開いている場合、すべてのウィンドウを複数のタブを持つ1つのウィンドウにマージします。

win.moveTabToNewWindow() macOS

ネイティブタブが有効になっており、現在のウィンドウに複数のタブがある場合、現在のタブを新しいウィンドウに移動します。

win.toggleTabBar() macOS

ネイティブタブが有効になっており、現在のウィンドウにタブが1つしかない場合、タブバーの表示/非表示を切り替えます。

win.addTabbedWindow(browserWindow) macOS

  • browserWindow BrowserWindow

ウィンドウインスタンスのタブの後に、このウィンドウにタブとしてウィンドウを追加します。

win.setVibrancy(type) macOS

  • type string | null - titlebar, selection, menu, popover, sidebar, header, sheet, window, hud, fullscreen-ui, tooltip, content, under-window, または under-page のいずれかを指定できます。詳細については、macOSのドキュメントを参照してください。

ブラウザウィンドウにビブラント効果を追加します。nullまたは空の文字列を渡すと、ウィンドウのビブラント効果が削除されます。

win.setBackgroundMaterial(material) Windows

  • material string
    • auto - デスクトップウィンドウマネージャー(DWM)に、このウィンドウのシステム描画の背景素材を自動的に決定させます。これがデフォルトです。
    • none - システムの背景を描画しません。
    • mica - 長く存続するウィンドウに対応する背景素材効果を描画します。
    • acrylic - 一時的なウィンドウに対応する背景素材効果を描画します。
    • tabbed - タブ付きタイトルバーを持つウィンドウに対応する背景素材効果を描画します。

このメソッドは、ブラウザウィンドウのシステム描画の背景素材(非クライアント領域の背後を含む)を設定します。

詳細については、Windowsドキュメントを参照してください。

注: このメソッドはWindows 11 22H2以降でのみサポートされています。

win.setWindowButtonPosition(position) macOS

フレームレスウィンドウにおける、交通信号機ボタンのカスタム位置を設定します。null を渡すと、位置はデフォルトにリセットされます。

win.getWindowButtonPosition() macOS

Point | null を返します - フレームレスウィンドウにおける交通信号機ボタンのカスタム位置です。カスタム位置がない場合は null が返されます。

win.setTouchBar(touchBar) macOS

  • touchBar TouchBar | null

現在のウィンドウの TouchBar レイアウトを設定します。null または undefined を指定すると、Touch Bar がクリアされます。このメソッドは、マシンに Touch Bar が搭載されている場合にのみ効果があります。

注意: TouchBar API は現在実験段階であり、将来の Electron リリースで変更または削除される可能性があります。

win.setBrowserView(browserView) 実験的 非推奨

  • browserView BrowserView | null - browserViewwin にアタッチします。他の BrowserView がアタッチされている場合、それらはこのウィンドウから削除されます。

注意 BrowserView クラスは非推奨となり、新しい WebContentsView クラスに置き換えられました。

win.getBrowserView() 実験的 非推奨

BrowserView | null を返します - win にアタッチされた BrowserView です。アタッチされていない場合は null を返します。複数の BrowserView がアタッチされている場合はエラーをスローします。

注意 BrowserView クラスは非推奨となり、新しい WebContentsView クラスに置き換えられました。

win.addBrowserView(browserView) 実験的 非推奨

複数の Browser View の操作をサポートする setBrowserView の代替 API です。

注意 BrowserView クラスは非推奨となり、新しい WebContentsView クラスに置き換えられました。

win.removeBrowserView(browserView) 実験的 非推奨

注意 BrowserView クラスは非推奨となり、新しい WebContentsView クラスに置き換えられました。

win.setTopBrowserView(browserView) 実験的 非推奨

browserView を、win にアタッチされた他の BrowserView よりも上に表示します。browserViewwin にアタッチされていない場合はエラーをスローします。

注意 BrowserView クラスは非推奨となり、新しい WebContentsView クラスに置き換えられました。

win.getBrowserViews() 実験的 非推奨

BrowserView[] を返します - addBrowserView または setBrowserView でアタッチされたすべての BrowserView の z-index でソートされた配列です。最上位の BrowserView が配列の最後の要素です。

注意 BrowserView クラスは非推奨となり、新しい WebContentsView クラスに置き換えられました。

win.setTitleBarOverlay(options) Windows Linux

  • options Object
    • color String (オプション) - ウィンドウコントロールオーバーレイが有効な場合の、CSS の色。
    • symbolColor String (オプション) - ウィンドウコントロールオーバーレイが有効な場合の、ウィンドウコントロールオーバーレイ上の記号の CSS 色。
    • height Integer (オプション) - タイトルバーとウィンドウコントロールオーバーレイの高さ(ピクセル単位)。

ウィンドウコントロールオーバーレイがすでに有効になっているウィンドウでは、このメソッドはタイトルバーオーバーレイのスタイルを更新します。

Linux では、symbolColor は、明示的に設定されていない場合、color と最小限のアクセス可能なコントラストを持つように自動的に計算されます。