Menu

菜单

Create application menus and context menus.

ProcessMain

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.

[!TIP] See also: A detailed guide about how to implement menus in your application.

[!WARNING] Electron's built-in classes cannot be subclassed in user code. For more information, see the 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呼出File的子选项。按钮标签中指定的字符会出现下划线， & 字符不会显示在按钮标签上。

In order to escape the & character in an item name, add a preceding &. 比如, &&File 将在按钮标签上出现 &File

传递 null 值可以禁用默认菜单。在 Windows 和 Linux 上，使用此方法移除窗口上的菜单栏可能会有额外的效果。

[!NOTE] The default menu will be created automatically if the app does not set one. It contains standard items such as File, Edit, View, and Window.

Menu.getApplicationMenu()

返回 Menu | null - 如果有设置, 则返回应用程序菜单， 如果没设置，则返回 null。

[!NOTE] The returned Menu instance doesn't support dynamic addition or removal of menu items. Instance properties can still be dynamically modified.

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 菜单行为。 Usually you would use the role property of a MenuItem.

See the macOS Cocoa Event Handling Guide for more information on macOS' native actions.

Menu.buildFromTemplate(template)

• template (MenuItemConstructorOptions | MenuItem)[]

Returns Menu

Generally, the template is an array of options for constructing a MenuItem. 使用方法可参考前文。

您还可以将其他字段附加到template，它们将成为菜单项的属性。

实例方法

menu 对象具有以下实例方法:

menu.popup([options])

• options Object (可选)
  • window BaseWindow (optional) - Default is the focused window.
  • frame WebFrameMain (optional) - Provide the relevant frame if you want certain OS-level features such as Writing Tools on macOS to function correctly. Typically, this should be params.frame from the context-menu event on a WebContents, or the focusedFrame property of a WebContents.
  • x number (可选) - 默认为当前鼠标的位置。如果指定了y，则该选项必选。
  • y number (可选) - 默认为当前鼠标的位置。如果指定了x，则该选项必选。
  • positioningItem number (可选) macOS - 在指定鼠标光标下定位的菜单项的索引。默认值为 -1。
  • sourceType string (optional) Windows Linux - This should map to the menuSourceType provided by the context-menu event. It is not recommended to set this value manually, only provide values you receive from other APIs or leave it undefined. Can be none, mouse, keyboard, touch, touchMenu, longPress, longTap, touchHandle, stylus, adjustSelection, or adjustSelectionReset.
  • callback Function (optional) - 会在菜单关闭后被调用.

Pops up this menu as a context menu in the BaseWindow.

[!TIP] For more details, see the Context Menu guide.

menu.closePopup([window])

• window BaseWindow (optional) - Default is the focused window.

Closes the context menu in the window.

menu.append(menuItem)

• menuItem MenuItem

将 menuItem 追加到菜单。

menu.getMenuItemById(id)

• id 字符串

Returns MenuItem | null - the item with the specified id

menu.insert(pos, menuItem)

• pos Integer
• menuItem MenuItem

将 menuItem 插入菜单的 pos 位置。

实例事件

使用 new Menu 创建对象或通过 Menu.buildFromTemplate返回对象均会触发下列事件：

[!NOTE] Some events are only available on specific operating systems and are labeled as such.

事件: '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.

Each Menu consists of multiple MenuItem instances and each MenuItem can nest a Menu into its submenu property.