当前位置: 首页 > 工具软件 > ShareMenu > 使用案例 >

Electron Menu菜单设置和右键设置

淳于升
2023-12-01

 主进程代码:

import { Menu, shell, ipcMain, BrowserWindow } from 'electron';

// normal (常规菜单项)
// separator (分割线)
// submenu (子菜单)
// checkbox (复选菜单项)
// radio (单选菜单项)

const template = [
  {
    label: '原生应用菜单演示',
    submenu: [
      {
        label: '个人信息',
      },
      {
        type: 'separator',
      },
      {
        label: '开机启动',
        type: 'checkbox',
        checked: true,
      },
      {
        type: 'separator',
      },
      {
        label: '性别',
        submenu: [
          {
            label: '男',
            type: 'radio',
          },
          {
            label: '女',
            type: 'radio',
          },
        ],
      },
    ],
  },
  {
    label: '文件',
    submenu: [
      {
        label: '新建',
        click() {},
      },
      {
        label: '打开',
        accelerator: 'ctrl+q',
        click() {},
      },
      {
        label: '保存',
        click() {

        },
      },
      {
        type: 'separator',  // 分割线
      },
      {
        label: '打印',
        click() {},
      },
      {
        label: '退出',
        click() {},
      },
    ],
  },
  {
    label: '编辑',
    submenu: [
      {
        label: '撤销',
        role: 'undo',
      },
      {
        label: '恢复',
        role: 'redo',
      },
      {
        type: 'separator',
      },
      { label: '截切',
        role: 'cut',
      },
      {
        label: '复制',
        role: 'copy',
      },
      {
        label: '黏贴',
        role: 'paste',
      },

      {
        label: '删除',
        role: 'delete',
      },
      {
        label: '全选',
        role: 'selectall',
      },
    ],
  },
  {
    label: '视图',
    submenu: [
      {
        label: '缩小',
        role: 'zoomin',
      },
      { label: '放大',
        role: 'zoomout',
      },
      { label: '重置缩放',
        role: 'resetzoom',
      },
      {
        type: 'separator',
      },
      {
        label: '全屏',
        role: 'togglefullscreen',
      },
    ],
  },
  {
    label: '帮助',
    submenu: [
      {
        label: '关于',
        click() {
          shell.openExternal('https://www.baidu.com');
        },
      },
    ],
  },
];
const m = Menu.buildFromTemplate(template);


Menu.setApplicationMenu(m);

// 右键菜单
const contextMenuTemplate = [
  {
    label: '撤销',
    role: 'undo',
  },
  {
    label: '恢复',
    role: 'redo',
  },
  {
    type: 'separator',
  },
  {
    label: '截切',
    role: 'cut',
  },
  {
    label: '复制',
    role: 'copy',
  },
  {
    label: '黏贴',
    role: 'paste',
  },
  {
    type: 'separator',
  },  // 分隔线
  {
    label: '全选',
    role: 'selectall',
  },
  // Select All菜单项
];

const contextMenu = Menu.buildFromTemplate(contextMenuTemplate);


// 监听右键事件
ipcMain.on('contextMenu', () => {
  contextMenu.popup(BrowserWindow.getFocusedWindow());
});

渲染进程代码:

 

import {ipcRenderer} from 'electron'



document.addEventListener('contextmenu',function(e){
    // 右键事件触发
    e.preventDefault();

    ipcRenderer.send('contextMenu');
})

 

 类似资料: