从 Electron 应用程序中删除菜单栏

Remove menubar from Electron app

如何从我的电子应用程序中删除这个菜单栏：

它还说 "Hello World"（这是因为我下载了 electron pre-built，一旦我打包应用程序就会消失吗？）。我没有把这些编码到html，所以我不知道怎么把它弄出来！-

您可以在 window 上使用 w.setMenu(null) 或设置 frame: false（这也会删除关闭、最小化和最大化选项的按钮）。参见 setMenu() or BrowserWindow(). Also check this thread

Electron 现在有 win.removeMenu()（在 v5.0.0 中添加），以删除应用程序菜单而不是使用 win.setMenu(null)。

Electron 7.1.x 似乎有一个错误，其中 win.removeMenu() 不起作用。唯一的解决方法是使用 Menu.setApplicationMenu(null)，但是，这将禁用所有菜单快捷方式，例如 F11 以切换全屏等

在新版本的Electron中，您可以在创建browserWindow时设置autoHideMenuBar: true，按Alt将再次显示菜单栏。

const mainWindow = new BrowserWindow({
  autoHideMenuBar: true,
})

当您打包您的应用程序时，默认菜单将不再存在，如果这在开发过程中困扰您，那么您可以按照@TonyVincent 的建议在浏览器 window 上调用 setMenu(null)。

在 main.js 这一行之前：

mainWindow = new BrowserWindow({width: 800, height: 900})

mainWindow.setMenu(null) //this will r menu bar

菜单可以隐藏或自动隐藏（如Slack或VS Code - 您可以按 Alt 以 show/hide 菜单）。

相关方法：

---- win.setMenu(menu) - 设置菜单为window的菜单栏， 将其设置为 null 将删除菜单栏。 （这将完全删除菜单）

mainWindow.setMenu(null)


---- win.setAutoHideMenuBar(hide) - 设置是否window菜单栏 应该自动隐藏自己。 设置后菜单栏将仅
当用户 按下 单个 Alt 键.

时显示 
mainWindow.setAutoHideMenuBar(true)

来源：https://github.com/Automattic/simplenote-electron/issues/293

还有无框的制作方法window如下图：

（没有关闭按钮什么都没有。可以是我们想要的（更好的设计））

const { BrowserWindow } = require('electron')
let win = new BrowserWindow({ width: 800, height: 600, frame: false })
win.show()

https://electronjs.org/docs/api/browser-window#winremovemenu-linux-windows

文档：https://electronjs.org/docs/api/frameless-window

编辑：（新）

win.removeMenu() Linux Windows Remove the window's menu bar.

https://electronjs.org/docs/api/browser-window#winremovemenu-linux-windows

添加了 win.removeMenu() 来删除应用程序菜单，而不是使用 win.setMenu(null)

根据 v5 添加的内容：

https://github.com/electron/electron/pull/16570

https://github.com/electron/electron/pull/16657

Electron v7 错误

对于 Electron 7.1.1 使用 Menu.setApplicationMenu 而不是 win.removeMenu()

根据此线程：
https://github.com/electron/electron/issues/16521

重要的是：您必须在创建 BrowserWindow 之前调用它 ！不然不行！

const {app, BrowserWindow, Menu} = require('electron')

Menu.setApplicationMenu(null);

const browserWindow = new BrowserWindow({/*...*/});

更新（在 BrowserWindow 构造中设置 autoHideMenuBar）

来自@kcpr 评论！我们可以在构造函数上设置 属性 和许多

目前最新稳定版 electron 8.3 上可用！
但是在旧版本中我也检查了 v1、v2、v3、v4！
所有版本都有！

按照这个 link
https://github.com/electron/electron/blob/1-3-x/docs/api/browser-window.md

对于 v8.3
https://github.com/electron/electron/blob/v8.3.0/docs/api/browser-window.md#new-browserwindowoptions

文档link
https://www.electronjs.org/docs/api/browser-window#new-browserwindowoptions

来自选项的文档：

autoHideMenuBar Boolean (optional) - Auto hide the menu bar unless the Alt key is pressed. Default is false.

这里有一个片段来说明它：


let browserWindow = new BrowserWindow({
    width: 800,
    height: 600,
    autoHideMenuBar: true // <<< here
})

使用这个：

mainWindow = new BrowserWindow({width: 640, height: 360})
mainWindow.setMenuBarVisibility(false)

参考：https://github.com/electron/electron/issues/1415

我试过mainWindow.setMenu(null)，但没用。

从 7.0.0 开始，上述大部分解决方案不再有效。 BrowserWindow.setMenu() 已被 Menu.setApplicationMenu() 取代，后者现在更改了所有 windows 上的菜单。 setMenu()、removeMenu() 不再做任何事情，顺便说一句，文档中仍然提到了这一点。

setAutoHideMenuBar() 仍然有效，但如果您打算将 Alt 用作热键修饰符，则可能会很麻烦。一旦菜单可见，您必须在远离 window（松散焦点）的地方单击才能再次隐藏菜单。

如果您的应用程序有多个 window，您不能在每个 window 上单独 set/remove 菜单。删除菜单的唯一方法是使用无框架 window 方法。这恰好是我当前应用程序中想要的，但在所有情况下都不是一个好的解决方案。

@"electron": "^7.1.1" : 

mainWindow = new browserWindow({ height: 500, width: 800});
//mainWindow.setAutoHideMenuBar(true);
mainWindow.autoHideMenuBar = true;

在浏览器中没有菜单的情况下按预期工作。

根据 this issue 的回答，您必须在 创建 window 之前调用 Menu.setApplicationMenu(null)

对于 Electron 7.1.1，你可以使用这个：

const {app, BrowserWindow, Menu} = require('electron')
Menu.setApplicationMenu(false)

根据官方文档@ https://github.com/electron/electron/blob/v8.0.0-beta.1/docs/api/menu.md 从 7.1.2 开始，现在执行此操作的正确方法我也在 8.0 上测试过它：

const { app, Menu } = require('electron')

Menu.setApplicationMenu(null)

这些解决方案有错误。 使用以下解决方案时，windows 关闭时有延迟。

Menu.setApplicationMenu(null),
&&
const updateErrorWindow = new BrowserWindow({autoHideMenuBar: true});

我使用了下面的解决方案。现在这样更好。

const window= new BrowserWindow({...});
window.setMenuBarVisibility(false);

2020 年更新，唯一对我有用的 bl**dy 东西：

Menu.setApplicationMenu(new Menu());

setMenu(null);是最佳答案，autohidemenu会在应用程序启动时显示


    function createWindow(){
        const win = new BrowserWindow({
            width: 1500,
            height: 800,
            webPreferences:{
                nodeIntergration: true
            }
        });
        win.setMenu(null);
    win.loadFile("index.html");
    }
    app.whenReady().then(createWindow);

在创建浏览器窗口时将 autoHideMenuBar 设置为 true

mainWindow = new BrowserWindow({
    autoHideMenuBar: true,
    width: 1200,
    height: 800
})

此处的大部分答案对较新版本无效。对于 9.0 或更高版本，Menu.setApplicationMenu(null); 应该可以。顺便说一下，Menu 从 electron 包导出：const {Menu} = require('electron');

电子12.0.6:

    let mainWindow = new BrowserWindow({
        autoHideMenuBar: true
    });

即使 autoHideMenuBar: true，您仍然可以使用 Alt 键切换菜单栏。

所以要完全隐藏它，请使用 mainWindow.setMenu(null)