Question

我正在构建一个为网站制作桌面界面的电子应用程序。在网站上，我已经注册了键绑定，例如显示所有可用键绑定表的Shift+?。

我必须创建一个与键绑定相对应的操作的应用菜单。从技术上讲，当用户点击菜单项时，它应该触发网页上的键绑定。例如：

当用户按下菜单上的帮助时→Shift+?正在触发键绑定→网页检测到keypress→网页显示所有已注册的键绑定表。

问题是我无法将Shift+?键绑定发送到webContents。这些尝试失败了：

webContents.sendInputEvent({type:'char', keyCode: 'Shift+?' });
webContents.sendInputEvent({type:'keydown', keyCode: 'Shift+?' });
webContents.sendInputEvent({type:'keyup', keyCode: 'Shift+?'});

如何强制网页根据特定的键绑定执行操作（a.k.a将键绑定发送到网页）？

UPD：我发现了一些细节。事件的顺序应为keyDown，char，keyUp。我为发送键绑定做了一个方便的功能：

function sendKeybinding(win, keyCode) {
  win.webContents.sendInputEvent({ type: 'keyDown', keyCode });
  win.webContents.sendInputEvent({ type: 'char', keyCode });
  win.webContents.sendInputEvent({ type: 'keyUp', keyCode });
}

使用此功能的MenuItem可能如下所示：

{
  label: 'Show Keymap',
  accelerator: ['Shift+/', '?'],
  click(menuItem, browserWindow) {
    sendKeybinding(browserWindow, '?');
  },
}

此外，在Shift+?的案例中有一个舱口：?只能在按下Shift的情况下输入，所以实际上，有两个加速器Shift+/和?。

但是，我仍然不知道如何输入像CmdOrControl+B这样的键绑定。

Answer 1

除了您发现的事件顺序之外，您还可以使用modifiers参数的sendInputEvents属性来发送带键输入的shift / ctrl / alt等修饰符。 有关详细信息，请参阅docs

使用以下代码，HTML可以检测到您想要的快捷方式：

main.js

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

function sendKeybinding (win, keyCode) {
  let modifiers = []
  modifiers.push('shift') // 'control', 'meta', etc.
  win.webContents.sendInputEvent({ type: 'keyDown', modifiers, keyCode })
  win.webContents.sendInputEvent({ type: 'char', modifiers, keyCode })
  win.webContents.sendInputEvent({ type: 'keyUp', modifiers, keyCode })
}

app.on('ready', function () {
  let win = new BrowserWindow()
  win.loadURL(path.resolve(__dirname, 'keybind.html'))
  const menuTemplate = [
    {
      label: 'Show Keymap',
      click (menuItem, browserWindow) {
        sendKeybinding(browserWindow, '?')
      }
    }
  ]
  const menu = Menu.buildFromTemplate(menuTemplate)
  Menu.setApplicationMenu(menu)
})

keybind.html

<html>
<body>
<p id="demo">Pressed Key: </p>
<script>
document.onkeypress = function (event) {
  var elem = document.getElementById("demo")
  elem.innerHTML = 'Pressed Key: ' + event.key
  if (event.shiftKey) elem.innerHTML += ' + Shift '
  if (event.ctrlKey) elem.innerHTML += ' + Ctrl '
  if (event.metaKey) elem.innerHTML += ' + Win/Cmd '
}
</script>
</body>
</html>

如何在电子中向webContents发送（模拟）键绑定？

1 个答案: