視窗自訂
BrowserWindow
模組是您的 Electron 應用程式的基礎,並且公開了許多 API,讓您可以自訂應用程式視窗的外觀和行為。本節介紹如何在 macOS、Windows 和 Linux 上實現各種視窗自訂的用例。
資訊
BrowserWindow
是 BaseWindow
模組的子類別。這兩個模組都允許您在 Electron 中建立和管理應用程式視窗,主要區別在於 BrowserWindow
支援單個全尺寸的網頁檢視,而 BaseWindow
支援組合多個網頁檢視。在本節文件的範例中,BaseWindow
可以與 BrowserWindow
互換使用。
📄️ 自訂標題列
應用程式視窗預設會套用作業系統提供的視窗外框 (chrome)。請勿與 Google Chrome 瀏覽器混淆,視窗 _chrome_ 指的是視窗的各個部分 (例如標題列、工具列、控制項),這些部分不是主要網頁內容的一部分。雖然作業系統視窗外框提供的預設標題列對於簡單的用例來說已足夠,但許多應用程式選擇移除它。實作自訂標題列可以讓您的應用程式在跨平台時感覺更加現代化和一致。
📄️ 自訂視窗互動
預設情況下,視窗是使用作業系統視窗外框提供的標題列來拖曳的。移除預設標題列的應用程式需要使用 app-region CSS 屬性來定義可用於拖曳視窗的特定區域。設定 app-region: drag 會將矩形區域標記為可拖曳。
📄️ 自訂視窗樣式
!無邊框視窗