javascript - 如何为 Electron 中的特定窗口制作单独的菜单？

Question

我正在 Windows 上开发一个关于此应用程序的窗口，我想为我的关于窗口制作一个自定义菜单栏。由于我已经有一个自定义菜单，有没有办法可以创建另一个菜单并将其仅应用于该特定窗口？

旁注: 这是我的新窗口代码，应该阻止它被调整并进入全屏，但由于某种原因，最小化和放大按钮仍然有效。

app.on('ready', createWindow);
electron.app.on('ready', () => {
  //Triger update check
  if (!isDev) {
    autoUpdater.checkForUpdates();
  }
})

function createWindow(){
  //create brower window
  win = new BrowserWindow({
  backgroundColor: '#2e2c29',
  width: 800,
  height: 600,
  //transparent: true,
  frame: false,
  titleBarStyle: 'hidden',
  backgroundColor: '#0000',
  webPreferences: {
    nodeIntegration: true
}
  });


//Quit when all windows are closed
  app.on('window-all-closed', () => {
    app.quit()
  })

app.once('ready', function() {

const template = [
  {
    label: 'File',
    submenu: [
      {
          label: 'About Hubris',
          click: () =>
          openAboutWindow()
          },
      { type: 'separator' },
      { role: 'hide' },
      { role: 'hideothers' },
      { role: 'unhide' },
      { type: 'separator' },
      { role: 'quit' }
    ]
  },
  {
label: 'View',
submenu: [

  { role: 'minimize' },
  { role: 'zoom' },
  { type: 'separator' },
  { role: 'togglefullscreen' }
    ]
  },
]

const menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu)



//here is the code for the about window
var newWindow = null

function openAboutWindow() {

  if (newWindow) {
    newWindow.focus()
    return
  }

  newWindow = new BrowserWindow({
    height: 439,
    resizable: false,
    width: 599,
    title: 'About Hubris',
    minimizable: false,
    fullscreenable: false,
    frame: false,
    titleBarStyle: 'hidden',

  })

  newWindow.loadURL('file://' + __dirname + '/about-this-app.html')

  newWindow.on('closed', function() {
    newWindow = null
  })
}
});

Answer 1

您可以即时切换菜单。我有一个具有“编辑器”和“演示”模式的应用程序。我为每种模式创建并存储一个菜单(它们有不同的菜单项):

let editorMenu = Menu.buildFromTemplate(menuTemplate);

并订阅相关的窗口事件(焦点、模糊等)。然后当窗口获得焦点时

Menu.setApplicationMenu(editorMenu);