ウインドウのカスタマイズ
BrowserWindow モジュールは、Electron アプリケーションの基盤であり、ブラウザウインドウの外観や動作を変更するために多くの API を公開しています。 このセクションでは、macOS、 Windows、および Linux でウィンドウカスタマイズを行うためのさまざまなユースケースを実装する方法について説明します。
BrowserWindow は BaseWindow モジュールのサブクラスです。 どちらのモジュールも、Electron でアプリケーション ウィンドウを作成および管理できます。主な違いは、BrowserWindow が単一のフルサイズの Web ビューをサポートするのに対し、BaseWindow が複数の Web ビューの合成をサポートすることです。 BaseWindow は、このセクションのドキュメントの例では BrowserWindow と相互に使用できます。
📄️ カスタムのタイトルバー
アプリケーションウインドウには、OS によって適用されるデフォルトのクロムがあります。 Google Chrome ブラウザと混同しないでください。ウインドウの _クロム_ とは、メインのウェブコンテンツの一部ではないウインドウの部分 (タイトルバー、ツールバー、コントロールなど) のことです。 OS のクロムが提供するデフォルトのタイトルバーは単純な使用例では十分ですが、多くのアプリケーションではタイトルバーを削除することを選択します。 カスタムのタイトルバーを実装すると、アプリケーションがよりモダンになり、プラットフォーム間で一貫性が保たれるようになります。
📄️ Custom Window Interactions
By default, windows are dragged using the title bar provided by the OS chrome. Apps that remove the default title bar need to use the app-region CSS property to define specific areas that can be used to drag the window. Setting app-region: drag marks a rectagular area as draggable.
📄️ Custom Window Styles
!フレームレスウインドウ