From 71ebb0d3e6e34040a8d53e497ff57cae6dfe581f Mon Sep 17 00:00:00 2001 From: joe-re Date: Thu, 20 Jul 2017 02:45:39 +0900 Subject: [PATCH] translate keyboard shortcuts doc to japanese --- docs-translations/jp/README.md | 1 + .../jp/tutorial/keyboard-shortcuts.md | 89 +++++++++++++++++++ 2 files changed, 90 insertions(+) create mode 100644 docs-translations/jp/tutorial/keyboard-shortcuts.md diff --git a/docs-translations/jp/README.md b/docs-translations/jp/README.md index 93f64c4db036..315b9b4fd914 100644 --- a/docs-translations/jp/README.md +++ b/docs-translations/jp/README.md @@ -26,6 +26,7 @@ _リンクになっていないリストは未翻訳のものです。_ * [Pepper Flashプラグインを使用する](tutorial/using-pepper-flash-plugin.md) * [Widevine CDMプラグインを使用する](tutorial/using-widevine-cdm-plugin.md) * [継続的インテグレーションシステムによるテスト(Travis, Jenkins)](tutorial/testing-on-headless-ci.md) +* [キーボードショートカット](tutorial/keyboard-shortcuts.md) # チュートリアル diff --git a/docs-translations/jp/tutorial/keyboard-shortcuts.md b/docs-translations/jp/tutorial/keyboard-shortcuts.md new file mode 100644 index 000000000000..507a219623e3 --- /dev/null +++ b/docs-translations/jp/tutorial/keyboard-shortcuts.md @@ -0,0 +1,89 @@ +# Keyboard Shortcuts + +> ローカル、グローバルのキーボードショートカットを設定します + +## ローカルショートカット + +[Menu] モジュールの設定により、アプリケーションにフォーカスがあるときのキーボードショートカットを設定できます。 +[MenuItem] を作成するときの [`accelerator`] プロパティで設定します。 + +```js +const {Menu, MenuItem} = require('electron') +const menu = new Menu() + +menu.append(new MenuItem({ + label: 'Print', + accelerator: 'CmdOrCtrl+P', + click: () => { console.log('time to print stuff') } +})) +``` + +キーの組み合わせをユーザのOSに基づいて変えることも簡単です。 + +```js +{ + accelerator: process.platform === 'darwin' ? 'Alt+Cmd+I' : 'Ctrl+Shift+I' +} +``` + +## グローバルショートカット + +[globalShortcut] モジュールを使うことで、アプリケーションにフォーカスがないときのキーボードイベントを検知することができます。 + +```js +const {app, globalShortcut} = require('electron') + +app.on('ready', () => { + globalShortcut.register('CommandOrControl+X', () => { + console.log('CommandOrControl+X is pressed') + }) +}) +``` + +## BrowserWindow でのキーボードショートカット + +もしキーボードショートカットイベントを [BrowserWindow] でハンドリングしたい場合は、rendererプロセスの中でwindowオブジェクトの`keyup` と `keydown` のイベントリスナーを使ってください。 + +```js +window.addEventListener('keyup', doSomething, true) +``` + +第3引数にtrueを指定した場合には、リスナーは常に他のリスナーが起動する前にキーイベントを受け取るようになります。そのため、 `stopPropagation()` を呼び出すことができないことに注意してください。 + +[`before-input-event`](web-contents.md#event-before-input-event) イベントは表示しているページの `keydown` and `keyup` イベントが発生する前に発行されます。 +メニューに表示がないショートカットも補足することができます。 + +もし自前でショートカットキーの判定を実装したくない場合には、[mousetrap] のような高度なキー検出を行うライブラリーがあります。 + +```js +Mousetrap.bind('4', () => { console.log('4') }) +Mousetrap.bind('?', () => { console.log('show shortcuts!') }) +Mousetrap.bind('esc', () => { console.log('escape') }, 'keyup') + +// combinations +Mousetrap.bind('command+shift+k', () => { console.log('command shift k') }) + +// map multiple combinations to the same callback +Mousetrap.bind(['command+k', 'ctrl+k'], () => { + console.log('command k or control k') + + // return false to prevent default behavior and stop event from bubbling + return false +}) + +// gmail style sequences +Mousetrap.bind('g i', () => { console.log('go to inbox') }) +Mousetrap.bind('* a', () => { console.log('select all') }) + +// konami code! +Mousetrap.bind('up up down down left right left right b a enter', () => { + console.log('konami code') +}) +``` + +[Menu]: ../api/menu.md +[MenuItem]: ../api/menu-item.md +[globalShortcut]: ../api/global-shortcut.md +[`accelerator`]: ../api/accelerator.md +[BrowserWindow]: ../api/browser-window.md +[mousetrap]: https://github.com/ccampbell/mousetrap