# Tray
用一個 `Tray` 來表示一個圖標,這個圖標處于正在運行的系統的通知區 ,通常被添加到一個 context menu 上.
```javascript
const electron = require('electron');
const app = electron.app;
const Menu = electron.Menu;
const Tray = electron.Tray;
var appIcon = null;
app.on('ready', function(){
appIcon = new Tray('/path/to/my/icon');
var contextMenu = Menu.buildFromTemplate([
{ label: 'Item1', type: 'radio' },
{ label: 'Item2', type: 'radio' },
{ label: 'Item3', type: 'radio', checked: true },
{ label: 'Item4', type: 'radio' }
]);
appIcon.setToolTip('This is my application.');
appIcon.setContextMenu(contextMenu);
});
```
__平臺限制:__
* 在 Linux, 如果支持應用指示器則使用它,否則使用 `GtkStatusIcon` 代替.
* 在 Linux ,配置了只有有了應用指示器的支持, 你必須安裝 `libappindicator1` 來讓 tray icon 執行.
* 應用指示器只有在它擁有 context menu 時才會顯示.
* 當在linux 上使用了應用指示器,將忽略點擊事件.
* 在 Linux,為了讓單獨的 `MenuItem` 起效,需要再次調用 `setContextMenu` .例如:
```javascript
contextMenu.items[2].checked = false;
appIcon.setContextMenu(contextMenu);
```
如果想在所有平臺保持完全相同的行為,不應該依賴點擊事件,而是一直將一個 context menu 添加到 tray icon.
## Class: Tray
`Tray` 是一個 [事件發出者][event-emitter].
### `new Tray(image)`
* `image` [NativeImage](native-image.md)
創建一個與 `image` 相關的 icon.
## 事件
`Tray` 模塊可發出下列事件:
**注意:** 一些事件只能在特定的os中運行,已經標明.
### Event: 'click'
* `event` Event
* `altKey` Boolean
* `shiftKey` Boolean
* `ctrlKey` Boolean
* `metaKey` Boolean
* `bounds` Object - tray icon 的 bounds.
* `x` Integer
* `y` Integer
* `width` Integer
* `height` Integer
當tray icon被點擊的時候發出事件.
__注意:__ `bounds` 只在 OS X 和 Windows 上起效.
### Event: 'right-click' _OS X_ _Windows_
* `event` Event
* `altKey` Boolean
* `shiftKey` Boolean
* `ctrlKey` Boolean
* `metaKey` Boolean
* `bounds` Object - tray icon 的 bounds.
* `x` Integer
* `y` Integer
* `width` Integer
* `height` Integer
當tray icon被鼠標右鍵點擊的時候發出事件.
### Event: 'double-click' _OS X_ _Windows_
* `event` Event
* `altKey` Boolean
* `shiftKey` Boolean
* `ctrlKey` Boolean
* `metaKey` Boolean
* `bounds` Object - tray icon 的 bounds.
* `x` Integer
* `y` Integer
* `width` Integer
* `height` Integer
當tray icon被雙擊的時候發出事件.
### Event: 'balloon-show' _Windows_
當tray 氣泡顯示的時候發出事件.
### Event: 'balloon-click' _Windows_
當tray 氣泡被點擊的時候發出事件.
### Event: 'balloon-closed' _Windows_
當tray 氣泡關閉的時候發出事件,因為超時或人為關閉.
### Event: 'drop' _OS X_
當tray icon上的任何可拖動項被刪除的時候發出事件.
### Event: 'drop-files' _OS X_
* `event`
* `files` Array - 已刪除文件的路徑.
當tray icon上的可拖動文件被刪除的時候發出事件.
### Event: 'drag-enter' _OS X_
當一個拖動操作進入tray icon的時候發出事件.
### Event: 'drag-leave' _OS X_
當一個拖動操作離開tray icon的時候發出事件.
Emitted when a drag operation exits the tray icon.
### Event: 'drag-end' _OS X_
當一個拖動操作在tray icon上或其它地方停止拖動的時候發出事件.
## 方法
`Tray` 模塊有以下方法:
**Note:** 一些方法只能在特定的os中運行,已經標明.
### `Tray.destroy()`
立刻刪除 tray icon.
### `Tray.setImage(image)`
* `image` [NativeImage](native-image.md)
讓 `image` 與 tray icon 關聯起來.
### `Tray.setPressedImage(image)` _OS X_
* `image` [NativeImage](native-image.md)
當在 OS X 上按壓 tray icon 的時候, 讓 `image` 與 tray icon 關聯起來.
### `Tray.setToolTip(toolTip)`
* `toolTip` String
為 tray icon 設置 hover text.
### `Tray.setTitle(title)` _OS X_
* `title` String
在狀態欄沿著 tray icon 設置標題.
### `Tray.setHighlightMode(highlight)` _OS X_
* `highlight` Boolean
當 tray icon 被點擊的時候,是否設置它的背景色變為高亮(blue).默認為 true.
### `Tray.displayBalloon(options)` _Windows_
* `options` Object
* `icon` [NativeImage](native-image.md)
* `title` String
* `content` String
展示一個 tray balloon.
### `Tray.popUpContextMenu([menu, position])` _OS X_ _Windows_
* `menu` Menu (optional)
* `position` Object (可選) - 上托位置.
* `x` Integer
* `y` Integer
從 tray icon 上托出 context menu . 當劃過 `menu` 的時候, `menu` 顯示,代替 tray 的 context menu .
`position` 只在 windows 上可用,默認為 (0, 0) .
### `Tray.setContextMenu(menu)`
* `menu` Menu
為這個 icon 設置 context menu .
[event-emitter]: http://nodejs.org/api/events.html#events_class_events_eventemitter
- 介紹
- 常見問題
- Electron 常見問題
- 向導
- 支持平臺
- 分發應用
- 提交應用到 Mac App Store
- 打包應用
- 使用 Node 原生模塊
- 主進程調試
- 使用 Selenium 和 WebDriver
- 使用開發人員工具擴展
- 使用 Pepper Flash 插件
- 使用 Widevine CDM 插件
- 教程
- 快速入門
- 桌面環境集成
- 在線/離線事件探測
- API文檔
- 簡介
- 進程對象
- 支持的 Chrome 命令行開關
- 環境變量
- 自定義的 DOM 元素
- File 對象
- <webview> 標簽
- window.open 函數
- 在主進程內可用的模塊
- app
- autoUpdater
- BrowserWindow
- contentTracing
- dialog
- globalShortcut
- ipcMain
- Menu
- MenuItem
- powerMonitor
- powerSaveBlocker
- protocol
- session
- webContents
- Tray
- 在渲染進程(網頁)內可用的模塊
- desktopCapturer
- ipcRenderer
- remote
- webFrame
- 在兩種進程中都可用的模塊
- clipboard
- crashReporter
- nativeImage
- screen
- shell
- 開發
- 代碼規范
- 源碼目錄結構
- 與 NW.js(原 node-webkit)在技術上的差異
- 構建系統概覽
- 構建步驟(OS X)
- 構建步驟(Windows)
- 構建步驟(Linux)
- 在調試中使用 Symbol Server