Menu

クラス: Menu

Create application menus and context menus.

プロセス: メイン

The presentation of menus varies depending on the operating system:

• Under Windows and Linux, menus are visually similar to Chromium.
• Under macOS, these will be native menus.

ヒント

あなたのアプリケーションにどうやってメニューを実装するかの詳細なガイド もご覧ください。

[!WARNING] Electron 組み込みのクラスはユーザコードでサブクラス化できません。詳細については、FAQ をご参照ください。

new Menu()

新しいメニューを作成します

静的メソッド

Menu クラスは以下の静的メソッドを持ちます。

Menu.setApplicationMenu(menu)

• menu Menu | null

macOS では、 menu をアプリケーションメニューとして設定します。 Windows と Linux では、 menu は各ウィンドウのトップメニューとして設定されます。

On Linux, the menu bar uses GTK theme colors when GTK is available. If GTK cannot initialize, it uses Chromium's built-in light or dark menu colors, following nativeTheme.shouldUseDarkColors.

更に Windows と Linux では、最上位のアイテム名に & を使用して、アクセラレータを生成させるときに取得する文字を指定できます。たとえば、ファイルメニューに &File を使用すると、その関連付けされたメニューを開く Alt-F アクセラレータが生成されます。ボタンラベルでその指定をした文字には下線が引かれ、& 文字はボタンラベルに表示されません。

In order to escape the & character in an item name, add a preceding &. 例えば、&&File とするとボタンラベルに &File が表示されます。

null を渡すと、既定のメニューが表示されなくなります。 Windows と Linux では、さらにウィンドウからメニューバーを削除します。

[!NOTE] アプリがメニューを設定しない場合、自動でデフォルトメニューが作成されます。 It contains standard items such as File, Edit, View, and Window.

Menu.getApplicationMenu()

戻り値 Menu | null - セットされていれば menu を、そうでなければ null を返します。

[!NOTE] 返される Menu インスタンスは、メニュー項目の動的な追加または削除ができません。インスタンスプロパティ であれば、動的に変更ができます。

Menu.setHighlightColors(options) Windows

History

Version(s)	Changes
None	API ADDED

• options Object | null
  • light Object (optional) - Colors used when menus are drawn with light colors.
    • background string (optional) - Background color of the hovered or keyboard-focused menu item, as a CSS color string (e.g. #0067c0).
    • foreground string (optional) - Text color of the hovered or keyboard-focused menu item, as a CSS color string.
  • dark Object (optional) - Colors used when menus are drawn with dark colors.
    • background string (optional) - Background color of the hovered or keyboard-focused menu item, as a CSS color string.
    • foreground string (optional) - Text color of the hovered or keyboard-focused menu item, as a CSS color string.

Sets the colors used to highlight the hovered or keyboard-focused item in every menu the app shows, including context menus and the menu bar's dropdowns. Light and dark colors are set separately, and any color left unset keeps the default for that mode. Each call replaces the colors set by any previous call. Passing null restores the defaults.

const { Menu } = require('electron')

Menu.setHighlightColors({
  light: { background: '#0067c0', foreground: '#ffffff' },
  dark: { background: '#4cc2ff', foreground: '#000000' }
})

Menus opened after the call use the new colors. The colors are not applied while Windows high contrast mode or forced colors are active, so the user's system colors take priority.

This method has no effect on macOS and Linux.

Menu.sendActionToFirstResponder(action) macOS

• action string

action をアプリケーションの最初のレスポンダーに送信します。 macOS メニューの既定の動作をエミュレートするために使用されます。通常は MenuItem の role プロパティを使用します。

macOS のネイティブの動作の詳細については、 macOS の Cocoa Event Handling Guide を参照してください。

Menu.buildFromTemplate(template)

• template (MenuItemConstructorOptions | MenuItem)[]

戻り値 Menu

一般的に、template は MenuItem を構築するための options の配列です。使用方法は上記を参照できます。

template の要素に他のフィールドを付けることもでき、それらは構築されたメニューアイテムのプロパティになります。

インスタンスメソッド

menu オブジェクトには以下のメソッドがあります。

menu.popup([options])

• options Object (任意)
  • window BaseWindow (任意) - 省略値はフォーカスされたウインドウです。
  • frame WebFrameMain (任意) - macOS の作文ツールなどといった特定の OS レベルの機能を正しく機能させたい場合は、関連するフレームを入力してください。通常、これは WebContents の context-menu イベント からの params.frame であるか、WebContents の focusedFrame プロパティ であるべきです。
  • x number (任意) - 既定ではマウスカーソルの現在位置です。 y が宣言されている場合は宣言する必要があります。
  • y number (任意) - 既定ではマウスカーソルの現在位置です。 x が宣言されている場合は宣言する必要があります。
  • positioningItem number (任意) macOS - マウスカーソルの位置に配置するメニューアイテムのインデックス。既定値は -1 です。
  • sourceType string (任意) Windows Linux - これは、context-menu イベントによって提供される menuSourceType と対応しなければなりません。この値の手動設定は非推奨です。他の API から受け取った値を与えるか、undefined のままにしておいてください。 none, mouse, keyboard, touch, touchMenu, longPress, longTap, touchHandle, stylus, adjustSelection, adjustSelectionReset のいずれかになります。
  • callback Function (任意) - メニューが閉じたしたときに呼ばれます。

このメニューを BaseWindow 内のコンテキストメニューとしてポップアップします。

[!TIP] 詳細については、コンテキストメニュー のガイドをご参照ください。

menu.closePopup([window])

• window BaseWindow (任意) - 省略値はフォーカスされたウインドウです。

window 内のこのコンテキストメニューを閉じます。

menu.append(menuItem)

• menuItem MenuItem

menu に menuItem を追加します。

menu.getMenuItemById(id)

• id string

Returns MenuItem | null - the item with the specified id

menu.insert(pos, menuItem)

• pos Integer
• menuItem MenuItem

menu の pos の位置に menuItem を挿入します。

インスタンスイベント

new Menu で作成されたオブジェクトまたは Menu.buildFromTemplate によって返されたオブジェクトは、以下のイベントが発生します。

[!NOTE] いくつかのイベントは特定のオペレーティングシステムでのみ利用可能で、そのように注記がつけられています。

イベント: 'menu-will-show'

戻り値:

• event Event

menu.popup() が呼ばれたときに発生します。

イベント: 'menu-will-close'

戻り値:

• event Event

手動か menu.closePopup() でポップアップが閉じられたときに発生します。

インスタンスプロパティ

menu オブジェクトには更に以下のプロパティがあります。

menu.items

A MenuItem[] array containing the menu's items.

各 Menu は複数の MenuItem インスタンスで構成され、各 MenuItem は submenu プロパティに Menu をネストできます。