node.js 从 Electron 应用程序中删除菜单栏
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/39091964/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Remove menubar from Electron app
提问by Sean Letendre
How do I remove this menu-bar from my electron apps:
如何从我的电子应用程序中删除此菜单栏:
Also it says "Hello World"(is this because I downloaded electron pre-built, and will go away once I package the application?). I didn't code these into the html, so I don't know how to get it out!-
它还说“Hello World”(这是因为我下载了预先构建的电子,并且一旦我打包应用程序就会消失?)。我没有把这些编码到 html 中,所以我不知道如何把它弄出来!-
回答by Tony Vincent
You can use w.setMenu(null)or set frame: false(this also removes buttons for close, minimize and maximize options) on your window. See setMenu()or BrowserWindow(). Also check this thread
您可以在窗口上使用w.setMenu(null)或设置frame: false(这也会删除关闭、最小化和最大化选项的按钮)。请参阅setMenu()或BrowserWindow()。也检查这个线程
Edit:
编辑:
Electron now have win.removeMenu()(added in v5.0.0), to remove application menus instead of using win.setMenu(null).
Electron 现在有win.removeMenu()(在 v5.0.0 中添加),以删除应用程序菜单而不是使用win.setMenu(null).
Edit:
编辑:
Electron 7.1.x seems to have a bug where win.removeMenu()doesn't work. The only workaround is to use Menu.setApplicationMenu(null)
Electron 7.1.x 似乎有一个win.removeMenu()无法工作的错误。唯一的解决方法是使用Menu.setApplicationMenu(null)
回答by iHad 169
Use this:
用这个:
mainWindow = new BrowserWindow({width: 640, height: 360})
mainWindow.setMenuBarVisibility(false)
Reference: https://github.com/electron/electron/issues/1415
参考:https: //github.com/electron/electron/issues/1415
I tried mainWindow.setMenu(null), but it didn't work.
我试过了mainWindow.setMenu(null),但没有用。
回答by Polyvios P
For Electron 7.1.1, you can use this:
对于 Electron 7.1.1,你可以使用这个:
const {app, BrowserWindow, Menu} = require('electron')
Menu.setApplicationMenu(false)
回答by Paul Sorensen
As of 7.0.0, most of the above solutions no longer work.
BrowserWindow.setMenu()has been replaced by Menu.setApplicationMenu(), which now changes the menu on all windows. setMenu(), removeMenu()no longer do anything, Which by the way are still mentioned in the docs.
从 7.0.0 开始,上述大多数解决方案不再有效。
BrowserWindow.setMenu()已替换为Menu.setApplicationMenu(),现在更改所有窗口上的菜单。setMenu(),removeMenu()不再做任何事情,顺便说一下,文档中仍然提到了这一点。
setAutoHideMenuBar()still works, but could be a nuisance if you planned to use Alt as a hotkey modifier. Once menu is visible you have to click away from window (loose focus) to hide menu again.
setAutoHideMenuBar()仍然有效,但如果您打算使用 Alt 作为热键修饰符,可能会很麻烦。一旦菜单可见,您必须单击远离窗口(松散焦点)以再次隐藏菜单。
If your application has more than one window, you can't set/remove menus separately on each window. The only way to remove a menu is to use the frameless window approach. That happens to be what I want in my current application, but not a good solution in all cases.
如果您的应用程序有多个窗口,则不能在每个窗口上单独设置/删除菜单。删除菜单的唯一方法是使用无框窗口方法。这恰好是我当前应用程序中想要的,但在所有情况下都不是一个好的解决方案。
回答by Mohamed Allal
The menu can be hiddenor auto-hidden(like in Slackor VS Code- you can press Alt to show/hidethe menu).
菜单可以隐藏或自动隐藏(就像在Slack或VS Code 中一样- 您可以按 Alt 来显示/隐藏菜单)。
Relevant methods:
相关方法:
---- win.setMenu(menu)- Sets the menu as the window's menu bar, setting it to null will remove the menu bar. (This will remove the menu completly)
---- win.setMenu(menu)- 将菜单设置为窗口的菜单栏,将其设置为 null 将删除菜单栏。(这将完全删除菜单)
mainWindow.setMenu(null)
---- win.setAutoHideMenuBar(hide)- Sets whether the window menu bar
should hide itself automatically. Once setthe menu bar will only
showwhen users pressthe single Alt key.
---- win.setAutoHideMenuBar(hide)- 设置窗口菜单栏是否应自动隐藏自身。一旦设置菜单栏将只
显示当用户按下单Alt键。
mainWindow.setAutoHideMenuBar(true)
Source: https://github.com/Automattic/simplenote-electron/issues/293
来源:https: //github.com/Automattic/simplenote-electron/issues/293
There is also the method for making a frameless window as shown bellow:
还有一种制作无框窗的方法,如下图:
(no close button no anything. Can be what we want (better design))
(没有关闭按钮没有任何东西。可以是我们想要的(更好的设计))
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/browser-window#winremovemenu-linux-windows
doc: https://electronjs.org/docs/api/frameless-window
文档:https: //electronjs.org/docs/api/frameless-window
Edit: (new)
编辑:(新)
win.removeMenu()Linux Windows Remove the window's menu bar.
win.removeMenu()Linux Windows 删除窗口的菜单栏。
https://electronjs.org/docs/api/browser-window#winremovemenu-linux-windows
https://electronjs.org/docs/api/browser-window#winremovemenu-linux-windows
Added win.removeMenu() to remove application menus instead of using win.setMenu(null)
添加 win.removeMenu() 以删除应用程序菜单而不是使用 win.setMenu(null)
That is added from v5 as per:
这是从 v5 添加的,如下所示:
https://github.com/electron/electron/pull/16570
https://github.com/electron/electron/pull/16570
https://github.com/electron/electron/pull/16657
https://github.com/electron/electron/pull/16657
Electron v7 bug
电子 v7 错误
For Electron 7.1.1 use Menu.setApplicationMenuinstead of win.removeMenu()
对于 Electron 7.1.1 使用Menu.setApplicationMenu代替win.removeMenu()
as per this thread:
https://github.com/electron/electron/issues/16521
按照这个线程:https:
//github.com/electron/electron/issues/16521
And the big note is: you have to call it before creating the BrowserWindow! Or it will not work!
重要的一点是:您必须在创建 BrowserWindow 之前调用它!否则就行不通了!
const {app, BrowserWindow, Menu} = require('electron')
Menu.setApplicationMenu(null);
const browserWindow = new BrowserWindow({/*...*/});
UPDATE (Setting autoHideMenuBar on BrowserWindow construction)
更新(在 BrowserWindow 构造上设置 autoHideMenuBar)
As by @kcpr comment! We can set the property and many on the constructor
正如@kcpr评论!我们可以在构造函数上设置属性和许多
That's available on the latest stable version of electron by now which is 8.3!
But too in old versions i checked for v1, v2, v3, v4!
It's there in all versions!
现在可以在最新的稳定版电子(8.3)上使用!
但是在旧版本中,我也检查了 v1、v2、v3、v4!
所有版本都有!
As per this link
https://github.com/electron/electron/blob/1-3-x/docs/api/browser-window.md
根据此链接
https://github.com/electron/electron/blob/1-3-x/docs/api/browser-window.md
And for the v8.3
https://github.com/electron/electron/blob/v8.3.0/docs/api/browser-window.md#new-browserwindowoptions
对于 v8.3
https://github.com/electron/electron/blob/v8.3.0/docs/api/browser-window.md#new-browserwindowoptions
The doc link
https://www.electronjs.org/docs/api/browser-window#new-browserwindowoptions
文档链接
https://www.electronjs.org/docs/api/browser-window#new-browserwindowoptions
From the doc for the option:
从该选项的文档中:
autoHideMenuBar Boolean (optional) - Auto hide the menu bar unless the Alt key is pressed. Default is false.
autoHideMenuBar Boolean (可选) - 除非按下 Alt 键,否则自动隐藏菜单栏。默认为假。
Here a snippet to illustrate it:
这里有一个片段来说明它:
let browserWindow = new BrowserWindow({
width: 800,
height: 600,
autoHideMenuBar: true // <<< here
})
回答by Vadim Macagon
When you package your app the default menu won't be there anymore, if this is bugging you during development then you can call setMenu(null)on the browser window as suggested by @TonyVincent.
当您打包应用程序时,默认菜单将不再存在,如果这在开发过程中困扰您,那么您可以setMenu(null)按照@TonyVincent 的建议调用浏览器窗口。
回答by Rachuri
@"electron": "^7.1.1" :
mainWindow = new browserWindow({ height: 500, width: 800});
//mainWindow.setAutoHideMenuBar(true);
mainWindow.autoHideMenuBar = true;
Working as expected without menu in browser.
在浏览器中没有菜单的情况下按预期工作。
回答by Kidoncio
Following the answer from this issue, you must call Menu.setApplicationMenu(null)beforethe window is created
按照这个问题的答案,您必须Menu.setApplicationMenu(null)在创建窗口之前调用
回答by Ivan Mihaylov
According to the official documentation @ https://github.com/electron/electron/blob/v8.0.0-beta.1/docs/api/menu.mdthe proper way to do this now since 7.1.2 and I have tested it on 8.0 as well is to :
根据官方文档@ 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)
回答by Edmar Pereira
Before this line at main.js:
在 main.js 的这一行之前:
mainWindow = new BrowserWindow({width: 800, height: 900})
mainWindow.setMenu(null) //this will r menu bar


