设置窗口标题栏的颜色 - electron.js答案

【问题标题】：set color of windows titlebar - electron.js设置窗口标题栏的颜色 - electron.js
【发布时间】：2018-02-23 14:39:46
【问题描述】：

我想为我的电子应用程序的 Windows 版本更改标题栏的颜色。目前它是白色的，如何将其更改为例如蓝色？

【问题讨论】：

【解决方案1】：

目前无法自定义原生标题栏。因此，第一步是通过告诉 BrowserWindow 隐藏框架（这也将隐藏菜单栏）来隐藏本机标题栏。

mainWindow = new BrowserWindow({
    frame: false
})

然后，您应该在 HTML、CSS 和 JS 中创建自定义标题栏（或导入第三方库，如 1 或 2）。这样，标题栏就位于 Electron 的渲染器进程之下。因此，实际上，例如在单击 X 按钮时退出应用程序，您应该利用 IPC 向主进程发送事件并退出应用程序。

例子：

# renderer
ipcRenderer.send('app:quit')

# main
ipcMain.on('app:quit', () => { app.quit() })

【讨论】：

【解决方案2】：

其实现在有办法
看看here，很多电子应用程序都在使用它，所以我认为是双赢...
只要确保先安装这个

npm i custom-electron-titlebar

【讨论】：

它没有过时。您链接了一个包。它不会使其成为自定义标题栏的官方方式，也不会与操作系统原生集成：github.com/AlexTorresSk/custom-electron-titlebar/blob/…

【解决方案3】：

你必须隐藏窗口标题栏并在html,css,js中建立一个新的窗口标题栏..

【讨论】：

【解决方案4】：

mainWindow = new BrowserWindow({
    width: 1000,
    height: 800,
    titleBarStyle: "hiddenInset"
})

【讨论】：