Electron 应用程序如何实现最小化到系统托盘
时间: 2024-12-16 16:21:35 浏览: 10
在 Electron 中,应用程序想要实现最小化至系统的托盘(Tray)通常涉及以下几个步骤:
1. **初始化托盘**: 首先,在应用启动时创建一个 `tray` 实例。你需要引入 `tray` 和 `menu` 模块:
```javascript
const { Tray } = require('electron')
const trayMenu = Menu.buildFromTemplate([...])
```
2. **创建图标**: 创建一个代表应用的小图标,可以是 `.ico` 格式的图片文件:
```javascript
const iconPath = path.join(__dirname, 'app_icon.ico')
const trayIcon = new Tray(iconPath)
```
3. **添加菜单**: 给托盘添加一个右键菜单,包含常见的操作,比如显示窗口、退出等:
```javascript
trayIcon.setContextMenu(trayMenu)
```
4. **最小化到托盘**: 当用户单击最小化按钮时,将窗口隐藏而不是关闭,并将焦点转移到托盘上:
```javascript
mainWindow.on('minimize', () => {
mainWindow.hide()
trayIcon.bounce()
})
```
5. **恢复窗口**: 当用户从托盘点击显示或者双击托盘图标时,需要重新激活窗口:
```javascript
trayIcon.on('click', () => {
mainWindow.show()
})
```
6. **退出处理**: 在关闭应用程序时,确保正确地清理托盘资源:
```javascript
app.on('will-quit', () => {
trayIcon.destroy()
})
```
记得在实际项目中替换 `path.join(__dirname, 'app_icon.ico')` 为你的图标路径。
阅读全文