7-electron自定义软件顶部菜单、右键菜单以及绑定快捷键

2019-08-22  本文已影响0人  程序员李钟意

Electron 自定义软件顶部菜单以及绑定快捷键

electron 中 menu 菜单可以用来创建原生菜单,它用作应用菜单和 context 菜单

这个模块是一个主进程的模块,并且可以通过 remote 模块给渲染进程调用。

// /main/menu.js
const {Menu} = require('electron');
const template = [
    {
        label: '文件',
        submenu: [
            {
                label: '新建文件',
                accelerator: 'Cmd+N',
                click: function() {
                    console.log('1 新建文件:', 1);
                }
            },
            {
                label: '新建窗口',
                click: function() {
                    console.log('1 新建窗口:', 1);
                }
            }
        ]
    },
    {
        label: '编辑',
        submenu: [
            {
                label: '复制',
                role: 'copy',
                click: function() {
                    console.log('1 复制:', 1);
                }
            },
            {
                label: '粘贴',
                role: 'paste',
                click: function() {
                    console.log('1 粘贴:', 1);
                }
            }
        ]
    }
];

const customMenu = Menu.buildFromTemplate(template);
Menu.setApplicationMenu(customMenu);

自定义右键菜单

// 左键菜单事件

window.addEventListener('contextmenu', function(event) {
    // 阻止默认事件
    event.preventDefault();

    // 在当前窗口点击右击的时候弹出 定义的菜单模板
    customMenu.popup({window: remote.getCurrentWindow()});
});
上一篇下一篇

猜你喜欢

热点阅读