admin管理员组

文章数量:1356566

I have an Electron app running on OSX and Windows. When the Windows version is full screen it still shows a menu bar and I would like it not to. Basically I want what happens on OSX: when the app is "full screen" no menu bar or window 'chrome' should appear.

I've tried setAutoHideMenuBar during my window set up but that made no difference. Am I using it wrong or misunderstanding what it is supposted to do?

I've seen some QAs suggestin setMenu(null) but won't that blow out the menu entirely? I do want the menu when in window mode or (on Windows) when the Alt key is pressed.


   mainWindow = new BrowserWindow({
        show: false,
        width: 1024,
        height: 768,
        minWidth: 400,
        minHeight: 200,
        resizable: true,
        backgroundColor: '#222',
        center: true,
        setAutoHideMenuBar: true
    });

From the docs:

win.setAutoHideMenuBar(hide)

hide Boolean

Sets whether the window menu bar should hide itself automatically. Once set the menu bar will only show when users press the single Alt key.

If the menu bar is already visible, calling setAutoHideMenuBar(true) won’t hide it immediately.

From the docs

win.setMenuBarVisibility(visible) Windows Linux

visible Boolean

Sets whether the menu bar should be visible. If the menu bar is auto-hide, users can still bring up the menu bar by pressing the single Alt key.

From the docs

win.setMenu(menu) Linux Windows

menu Menu

Sets the menu as the window’s menu bar, setting it to null will remove the menu bar.

I have an Electron app running on OSX and Windows. When the Windows version is full screen it still shows a menu bar and I would like it not to. Basically I want what happens on OSX: when the app is "full screen" no menu bar or window 'chrome' should appear.

I've tried setAutoHideMenuBar during my window set up but that made no difference. Am I using it wrong or misunderstanding what it is supposted to do?

I've seen some QAs suggestin setMenu(null) but won't that blow out the menu entirely? I do want the menu when in window mode or (on Windows) when the Alt key is pressed.


   mainWindow = new BrowserWindow({
        show: false,
        width: 1024,
        height: 768,
        minWidth: 400,
        minHeight: 200,
        resizable: true,
        backgroundColor: '#222',
        center: true,
        setAutoHideMenuBar: true
    });

From the docs:

win.setAutoHideMenuBar(hide)

hide Boolean

Sets whether the window menu bar should hide itself automatically. Once set the menu bar will only show when users press the single Alt key.

If the menu bar is already visible, calling setAutoHideMenuBar(true) won’t hide it immediately.

From the docs

win.setMenuBarVisibility(visible) Windows Linux

visible Boolean

Sets whether the menu bar should be visible. If the menu bar is auto-hide, users can still bring up the menu bar by pressing the single Alt key.

From the docs

win.setMenu(menu) Linux Windows

menu Menu

Sets the menu as the window’s menu bar, setting it to null will remove the menu bar.

Share Improve this question asked Aug 23, 2017 at 23:39 springspring 18.6k17 gold badges87 silver badges167 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 5

An error on my part and a "go figure"

  1. I was misusing the setAutoHideMenuBar mand, trying to use it as an option when creating the window. The correct option syntax is autoHideMenuBar: true.

app.on('ready', function () {
    mainWindow = new BrowserWindow({
        show: false,
        width: 1024,
        height: 768,
        minWidth: 400,
        minHeight: 200,
        resizable: true,
        backgroundColor: '#222',
        center: true,
        autoHideMenuBar: true
    }); 

  1. To handle toggling fullscreen, in setting up my menu I used the shortcut

    role: 'togglefullscreen'

While this works and includes the keyboard accelerators, the menu bar always appears and the autoHideMenuBarsetting is apparently ignored. I don't understand why. So instead of the shortcut, I use this and the menu bar hides correctly.

            {
                label: 'Toggle Full Screen',
                click: () => { toggleFullscreen();},
                accelerator: 'CmdOrCtrl+f'
            }

function toggleFullscreen() {
    if (mainWindow.isFullScreen()) {
        mainWindow.setFullScreen(false);
    } else {
        mainWindow.setFullScreen(true);
    }
}

Use setFullScreen method.

function (item, focusedWindow) {
    if (focusedWindow) {
        focusedWindow.setFullScreen(!focusedWindow.isFullScreen())
    }
}

本文标签: javascriptHiding the Window Menu when app is full screen on WindowsStack Overflow