Electron系统托盘

系统托盘 Tray

1. 主进程

代码如下（示例）：

const{ app, BrowserWindow,Tray, Menu } require'electron'
let mainWindow
let appTray = null; // 在外面创建 tray ，防止被自动删除，导致图标消失
function createWindow () {
  /**
   * Initial window options
   */
  mainWindow = new BrowserWindow({
    height: 620,
    width: 400,
    useContentSize: true,
    // frame: false,//添加后自定义标题//自定义边框
    // movable: true,//可否移动
    webPreferences:{
      nodeIntegration:true,
      contextIsolation: false,
      webSecurity: false,
    },   
  });   
  mainWindow.loadFile('./index.html')
  
  // 系统托盘
  //系统托盘右键菜单
  var trayMenuTemplate = [
    {
        label: "显示主窗口",        
        click: function() {
            mainWindow.show();         
        } //打开相应页面
    },
    {
      //打开相应页面
        label: "检查更新",
        click: function() {
        } 
    },
    {   //打开相应页面
        label: "web代理",
        click: function() {} 
    },
    {
        label: "查看日志",
        click: function() {
        } 
    },
    {
        label: "增强加密",
        click: function() {
          //右下角弹出消息弹框 
         }       
    },
    {
        label: "退出客户端",
        click: function() {
            app.quit();
        }
    },
    {
      label: "查看版本信息",
      click: function() {
        //打开相应页面
      } 
    }
    ];
    //系统托盘图标目录
    let iconPath = path.join(__dirname, "../assets/logo3.png");
    let appTray = new Tray(iconPath);
    console.log(iconPath);
    //图标的上下文菜单
    const contextMenu = Menu.buildFromTemplate(trayMenuTemplate);
    //设置此托盘图标的悬停提示内容
    appTray.setToolTip("XXXX");
    //设置此图标的上下文菜单
    appTray.setContextMenu(contextMenu);

    //系统托盘图标闪烁
    let count = 0,
    timer = null;
    timer = setInterval(function() {
      count++;
      if (count % 2 == 0) {
          appTray.setImage(iconPath);
      } else {
          appTray.setImage(iconPath);
      }
    }, 600);

    //单点击 1.主窗口显示隐藏切换 2.清除闪烁
    // 单击显示主窗口，再单击隐藏主窗口
    appTray.on("click", function() {
      if (!!timer) {
          appTray.setImage(iconPath);
          //主窗口显示隐藏切换
          mainWindow.isVisible() ? mainWindow.hide() : mainWindow.show();
          // 关闭托盘显示
          // appTray.destroy();
      }
    });
}

app.on('ready', createWindow)

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

2. 实现效果