キーボード ショート カット
概要
この機能により、Electron アプリケーションのロー カルとグローバルのキーボードショートカットを設定できます。
サンプル
ローカルショートカット
ローカルキーボードショートカットは、アプリケーションにフォーカスしているときのみトリガーされます。 ローカルキーボードショートカットを設定するには、Menu モジュール内の MenuItem 作成時に accelerator
プロパティを指定する必要があります。
クイックスタートガイド の作業用アプリケーションから始めることにして、main.js
ファイルを以下のように更新します。
- main.js
- index.html
const { app, BrowserWindow, Menu, MenuItem } = require('electron/main')
function createWindow () {
const win = new BrowserWindow({
width: 800,
height: 600
})
win.loadFile('index.html')
}
const menu = new Menu()
menu.append(new MenuItem({
label: 'Electron',
submenu: [{
role: 'help',
accelerator: process.platform === 'darwin' ? 'Alt+Cmd+I' : 'Alt+Shift+I',
click: () => { console.log('Electron rocks!') }
}]
}))
Menu.setApplicationMenu(menu)
app.whenReady().then(createWindow)
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow()
}
})
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello World!</title>
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
</head>
<body>
<h1>Hello World!</h1>
<p>Hit Alt+Shift+I on Windows, or Opt+Cmd+I on mac to see a message printed to the console.</p>
</body>
</html>
注意: 上記のコードでは、ユーザーのオペレーティングシステムによってアクセラレーターを変えていることがわかります。 macOS では
Alt+Cmd+I
で、Linux と Windows ではAlt+Shift+I
です。
Electron アプリケーションを起動すると、アプリケーションメニューが先ほど定義したローカルショートカットとともに表示されます。
ヘルプ
をクリックする又は定義したアクセラレータを押してから、Electron アプリケーションを実行したターミナルを開くと、click
イベントがトリガーされたことで生成されたメッセージ "Electron rocks!" が表示されます。