系统托盘

将图标和上下文菜单添加到系统托盘。

进程: 主进程

Tray是一个[EventEmitter][event-emitter].

const {app, Menu, Tray} = require('electron')
let tray = null
app.on('ready', () => {
  tray = new Tray('/path/to/my/icon')
  const contextMenu = Menu.buildFromTemplate([
    {label: 'Item1', type: 'radio'},
    {label: 'Item2', type: 'radio'},
    {label: 'Item3', type: 'radio', checked: true},
    {label: 'Item4', type: 'radio'}
  ])
  tray.setToolTip('这是我的应用程序.')
  tray.setContextMenu(contextMenu)
})

平台限制:

  • 在Windows上,建议使用ICO图标以获得最佳的视觉效果。

  • 如果应用程序指示器没有一个上下文菜单时,它将不会显示。

  • 在Linux中,如果支持应用程序指示器则使用它,否则使用 GtkStatusIcon

  • 在Linux的发行版中,仅支持应用程序指示器,您需要安装 libappindicator1 ,以便使用托盘图标(tray icon)。

  • 在Linux中,如果使用了应用指示器, click事件则被忽略.

  • 在Linux中,为了让个别的 MenuItem 起效,你必须再次调用 setContextMenu .例如:

    ```JavaScript

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

let appIcon = null app.on('ready', () => { appIcon = new Tray('/path/to/my/icon') const contextMenu = Menu.buildFromTemplate([ {label: 'Item1', type: 'radio'}, {label: 'Item2', type: 'radio'} ])

//更改上下文菜单 contextMenu.items[1].checked = false //因为我们修改了上下文菜单,所以再次为Linux调用 appIcon.setContextMenu(contextMenu) })

tray.displayBalloon(options) Windows

用途:显示托盘气球

  • options Object

    • icon (NativeImage | String) - (可选)

    • title String - (可选)

    • content String - (可选)

tray.popUpContextMenu([menu, position]) macOS Windows

用途:弹出托盘图标的上下文菜单

  • menu Menu (可选)

  • position Object (可选) - 弹出位置。

    • x Integer

    • y Integer

划过 menu时则显示 menu,而不是托盘图标的上下文菜单。position仅在Windows上可用,默认为(0,0)。

tray.setContextMenu(menu)

用途:设置此图标的上下文菜单。

  • menu Menu

tray.getBounds() macOS Windows

用途:获取此图标的 bounds对象(Rectangle)

tray.isDestroyed()

用途:判断托盘图标是否已被销毁( Boolean)

[event-emitter]: https://nodejs.org/api/events.html#events_class_eventemitter

Last updated

Was this helpful?