Electron系统托盘 托盘右键菜单、托盘图标闪烁 点击右上角关闭按钮隐藏到托盘(仿杀毒软件)

发布于 1周前 作者 magege666 最后一次编辑是 5天前 来自 分享

Electron系统托盘 托盘右键菜单、托盘图标闪烁 点击右上角关闭按钮隐藏到托盘视频教程:https://www.itying.com/goods-929.html

一、 Electron系统托盘、任务通知栏图标介绍

2.png

1.png

二、 Electron 创建任务栏图标以及任务栏图标右键菜单

var { Menu, Tray,app,BrowserWindow } = require('electron');


const path = require('path');

var appIcon = new Tray(path.join(__dirname,'lover.png'));

const menu = Menu.buildFromTemplate( [
    {
        label: '设置',
        click: function () {} //打开相应页面
    },
    {
        label: '帮助',
        click: function () {}
    },
    {
        label: '关于',
        click: function () {}
    },
    {
        label: '退出',
        click: function () {
            // BrowserWindow.getFocusedWindow().webContents().send('close-main-window');
             app.quit();
        
        }
    }
])

appIcon.setToolTip('my best app');
appIcon.setContextMenu(menu);

三、监听任务栏图标的单击、双击事件

var { Menu, Tray,app,BrowserWindow } = require('electron');
var appIcon = new Tray(path.join(__dirname,'lover.png'));

appIcon.on('double-click',()=>{    
     console.log(win);
     win.show();
})

四、Electron点击右上角关闭按钮隐藏任务栏图标

const win = BrowserWindow.getFocusedWindow();

win.on('close',(e)=>{
        console.log(win.isFocused());
        if(!win.isFocused()){
            win=null;
        }else{
            e.preventDefault();  /*阻止应用退出*/

            win.hide(); /*隐藏当前窗口*/

        }       
})

五、Electron实现任务栏闪烁图标

timer=setInterval(function() {
        count++;
        if (count%2 == 0) {            
            appIcon.setImage(path.join(__dirname,'empty.ico'))
        } else {
            appIcon.setImage(path.join(__dirname,'lover.png'))
        }
}, 500);

回到顶部