当前位置 : 主页 > 网页制作 > Nodejs >

node.js – 如何在电子中向webContents发送(模拟)键绑定?

来源:互联网 收集:自由互联 发布时间:2021-06-16
我正在构建电子应用程序,为网站制作桌面界面.在网站上,我已经注册了键绑定,比如Shift?它显示了所有可用键绑定的表. 我必须创建一个与键绑定相对应的动作应用菜单.从技术上讲,当用
我正在构建电子应用程序,为网站制作桌面界面.在网站上,我已经注册了键绑定,比如Shift?它显示了所有可用键绑定的表.

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

When user press Help on the menu → Shift+? keybinding is being triggered → webpage detects keypress → webpage shows the table of all registered keybindings appears.

问题是我不能发送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这样的键绑定.

除了你发现的事件顺序,你可以使用sendInputEvents参数的modifiers属性来发送带键输入的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>
网友评论