乐闻世界logo
搜索文章和话题

Electron 的菜单有哪些不同类型?

浏览23
7月9日 23:42

在 Electron 中,菜单主要分为以下几种类型:

  1. 应用程序菜单(Application Menu): 应用程序菜单是位于应用窗口顶部的主菜单,通常包括文件、编辑、视图、窗口和帮助等常见的菜单项。例如,在 macOS 上,应用程序菜单还包括应用名称的菜单,这个菜单通常包含关于、服务、隐藏、退出等选项。

  2. 上下文菜单(Context Menu): 上下文菜单是右键点击时出现的菜单,这种菜单通常与特定的上下文或界面元素相关联,如文本编辑区右键可能出现剪切、复制、粘贴等选项。上下文菜单可以根据应用中当前状态或元素类型提供不同的选项。

  3. 托盘菜单(Tray Menu): 托盘菜单是指在系统托盘图标(或系统通知区域图标)上右键点击或单击时显示的菜单。这类菜单常用于背景运行的应用,允许用户快速访问应用功能,如打开主窗口、退出应用等。

通过 Electron 的 Menu 模块,开发者可以灵活地构建和修改这些菜单。例如,你可以使用以下代码段来创建一个简单的应用程序菜单:

javascript
const { Menu, MenuItem } = require('electron') const template = [ { label: '编辑', submenu: [ { label: '撤销', role: 'undo' }, { label: '重做', role: 'redo' }, { type: 'separator' }, { label: '剪切', role: 'cut' }, { label: '复制', role: 'copy' }, { label: '粘贴', role: 'paste' } ] }, { label: '视图', submenu: [ { label: '重载', role: 'reload' }, { label: '全屏切换', role: 'togglefullscreen' } ] } ] const menu = Menu.buildFromTemplate(template) Menu.setApplicationMenu(menu)

这段代码定义了一个具有“编辑”和“视图”两个主菜单项的应用程序菜单,每个菜单项下有具体的操作选项。通过使用角色(role)属性,Electron 能够提供一些常用的行为,如撤销、剪切、复制等,简化开发过程。

标签:Electron