javascript - Electron 全局快捷方式切换菜单栏的显示/隐藏

Question

我正在尝试向我的 Electron 应用程序添加一个全局快捷方式，以切换显示/隐藏它。我的应用程序是使用 maxogden/menubar 构建的菜单栏应用程序和 react 。

我有以下代码。为了简洁起见，我省略了一些内容，但这就是我设置全局快捷方式的方式。

我认为注意 maxogden/menubar Readme 上的提示之一也很重要:

Use mb.on('after-create-window', callback) to run things after your app has loaded

const { globalShortcut } = require('electron');
const keyboardShortcuts = {
  open: 'CommandOrControl+Shift+g',
  close: 'CommandOrControl+Shift+g'
}

menu.on('after-create-window', () => {
  globalShortcut.register(keyboardShortcuts.open, () => {
    menu.window.show();
  });
});

menu.on('after-show', () => {
  globalShortcut.unregister(keyboardShortcuts.open);
  globalShortcut.register(keyboardShortcuts.close, () => {
    menu.window.hide();
  });
});

menu.on('focus-lost', () => {
  globalShortcut.unregister(keyboardShortcuts.close);
  globalShortcut.register(keyboardShortcuts.open, () => {
    menu.window.show();
  });
});

一旦菜单栏首次打开，我的快捷方式就会注册并将用于显示应用程序。但是，我实现的用于取消注册快捷方式并重新注册它以隐藏应用程序(显示时)的代码似乎不起作用。

我不确定重新注册快捷方式的代码是否在正确的事件处理程序中设置，即 after-show 和 focus-lost。我有一种感觉，我正在使用的这些事件处理程序与我的 menu 而不是 menu.window 直接相关。这可以解释为什么快捷方式没有重新注册，但我不确定。

有谁知道如何明智地设置全局快捷方式切换来打开/关闭我的菜单栏应用程序？

Answer 1

从菜单栏文档 ( https://github.com/maxogden/menubar ) 中，菜单栏实例公开了以下方法:

{
  app: the electron require('app') instance,
  window: the electron require('browser-window') instance,
  tray: the electron require('tray') instance,
  positioner: the electron-positioner instance,
  setOption(option, value): change an option after menubar is created,
  getOption(option): get an menubar option,
  showWindow(): show the menubar window,
  hideWindow(): hide the menubar window
}

使用menu.showWindow()和menu.hideWindow()代替menu.window.show()和menu .window.hide() 可以工作。

我进一步建议您使用内置事件来管理您的状态，简化您的代码和实现:

const { globalShortcut } = require('electron');

let isShown = false;
menu
  .on('after-show', () => { isShown = true })
  .on('after-hide', () => { isShown = false })
  .on('focus-lost', () => { isShown = false });

globalShortcut.register('CommandOrControl+Shift+g', () => {
  isShown ? menu.hideWindow() : menu.showWindow()
});