在 Electron js 中 frame: false 时有没有办法显示菜单栏？

Question

我正在尝试在 Windows 的 Electron js 中添加自定义标题栏。所以为了隐藏我写的默认标题栏：

mainWindow = new BrowserWindow({
        frame: false
    });  

但是上面的代码也隐藏了菜单栏。我只希望默认标题栏消失，而不影响菜单栏。有什么办法可以做到这一点？

Answer 1

将 Electron 的

frame

选项设置为

false

创建一个 frameless 窗口.

无框窗口没有标题栏或菜单。这被称为没有chrome。

从这里您可以使用最小化、恢复、最大化和关闭按钮功能构建您自己的自定义标题栏。如果您的应用程序被设计为在不同的操作系统上工作，那么您可能希望复制按钮位置、形状和功能。

不幸的是，使用无框窗口的副作用是您确实会丢失本机菜单。同样，这可以使用 HTML、CSS 和 JS 重新创建。也就是说，如果您希望再次模仿一个以上的特定操作系统并忠于其设计，则需要做一些工作。

或者，您可以在所有操作系统中使用一种风格的标题栏和菜单设计。作为设计师，选择权在您手中。

总而言之，虽然可以实现上述所有内容，但正确设置它可能很耗时。因此，您确实需要权衡自定义标题栏是否值得实施所需的努力。