Electron如何实现系统托盘？

在Electron中，你可以使用Tray API来创建系统托盘图标。以下是一个简单的示例，说明如何在Electron应用程序中实现系统托盘：

首先，确保你已经安装了Electron。你可以通过npm（Node.js包管理器）来安装Electron。

npm install electron --save-dev

然后，创建一个新的Electron项目，并在主进程文件（通常是main.js或index.js）中添加以下代码：

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

let tray = null;
let window = null;

function createWindow() {
  window = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      contextIsolation: false,
    },
  });

  window.loadFile('index.html');
}

function createTray() {
  tray = new Tray(path.join(__dirname, 'tray-icon.png')); // 替换为你的托盘图标路径

  const trayMenuTemplate = [
    {
      label: 'Show App',
      click: () => {
        window.show();
      },
    },
    {
      label: 'Quit',
      click: () => {
        app.quit();
      },
    },
  ];

  const trayMenu = Menu.buildFromTemplate(trayMenuTemplate);
  tray.setContextMenu(trayMenu);

  tray.on('click', () => {
    window.isVisible() ? window.hide() : window.show();
  });
}

app.whenReady().then(() => {
  createWindow();
  createTray();
});

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

app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) {
    createWindow();
  }
});

在这个示例中，我们首先导入了必要的Electron模块，然后定义了两个函数：createWindow用于创建应用程序窗口，createTray用于创建系统托盘图标。在createTray函数中，我们使用Tray类创建了一个托盘图标，并为其添加了一个上下文菜单。我们还为托盘图标添加了一个点击事件监听器，用于显示或隐藏应用程序窗口。最后，我们在应用程序准备就绪时调用这两个函数。

请确保将tray-icon.png替换为你自己的托盘图标文件路径。图标文件应该位于与主进程文件相同的目录中，或者你可以提供图标的绝对路径。

现在，当你运行Electron应用程序时，它应该会在系统托盘中显示一个图标。你可以通过点击托盘图标来显示或隐藏应用程序窗口，还可以通过右键点击托盘图标来访问上下文菜单中的选项。