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

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

作者: 程序员李钟意 | 来源:发表于2019-08-22 11:01 被阅读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()});
    });
    

    相关文章

      网友评论

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

          本文链接:https://www.haomeiwen.com/subject/tzagsctx.html