16. Tray

原文:https://github.com/electron/electron/blob/master/docs/api/tray.md
譯者:Lin

添加圖標(biāo)和右鍵菜單到系統(tǒng)的通知區(qū)域

進(jìn)程:主進(jìn)程

Tray是一個(gè)EventEmitter檀头。

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('This is my application.')
tray.setContextMenu(contextMenu)
})

平臺(tái)的局限性:

  • Linux中如果支持應(yīng)用指示器那么應(yīng)用指示器將被使用,否則將使用GtkStatusIcon代替覆糟。
  • Linux發(fā)行版中支持應(yīng)用指示器顶捷,你需要安裝libappindicator1來使tray圖標(biāo)工作弃舒。
  • 當(dāng)有右鍵菜單時(shí)才會(huì)展示應(yīng)用指示器。
  • 當(dāng)Linux中的應(yīng)用指示器被使用,click事件將被忽略杖剪。
  • Linux中為了使個(gè)別的MenuItems的改變生效,你需要再次調(diào)用setContextMenu驰贷。例如:
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'}
   ])

   // Make a change to the context menu
   contextMenu.items[1].checked = false

   // Call this again for Linux because we modified the context menu
   appIcon.setContextMenu(contextMenu)
})
  • Windows中建議使用ICO格式的圖標(biāo)來獲得最好的視覺效果盛嘿。

如果你想在所有平臺(tái)上保持完全相同的行為,你需要不依賴點(diǎn)擊事件并且將右鍵菜單依附在托盤圖標(biāo)上括袒。

new Tray(image)

通過image創(chuàng)建一個(gè)托盤圖標(biāo)次兆。

實(shí)例的事件

Tray模塊分發(fā)以下事件:

事件: 'click'

  • event Event類型
    • altKey Boolean類型
    • shiftKey Boolean類型
    • ctrlKey Boolean類型
    • metaKey Boolean類型
  • bounds Rectangle類型 - 托盤圖標(biāo)的邊界。

當(dāng)托盤圖片被點(diǎn)擊的時(shí)候被分發(fā)锹锰。

事件: 'right-click' MacOS Windows

  • event Event
    • altKey Boolean
    • shiftKey Boolean
    • ctrlKey Boolean
    • metaKey Boolean
  • bounds Rectangle類型 - 托盤圖標(biāo)的邊界类垦。

當(dāng)托盤圖片被右鍵點(diǎn)擊的時(shí)候被分發(fā)。

事件: 'double-click' MacOS Windows

  • event Event
    • altKey Boolean
    • shiftKey Boolean
    • ctrlKey Boolean
    • metaKey Boolean
  • bounds Rectangle類型 - 托盤圖標(biāo)的邊界城须。

當(dāng)托盤圖片被雙擊的時(shí)候被分發(fā)蚤认。

事件: 'balloon-show' Windows

當(dāng)托盤氣球展示的時(shí)候被分發(fā)。

事件: 'balloon-click' Windows

當(dāng)托盤氣球被點(diǎn)擊的時(shí)候被分發(fā)糕伐。

事件: 'balloon-closed' Windows

當(dāng)托盤氣球因?yàn)槌瑫r(shí)關(guān)閉或者用戶手動(dòng)點(diǎn)擊關(guān)閉時(shí)被分發(fā)砰琢。

事件: 'drop' MacOS

任何被拖動(dòng)的項(xiàng)目被拖動(dòng)到托盤圖標(biāo)上的時(shí)候被分發(fā)。

事件: 'drop-files' MacOS

  • event Event類型
  • files String[]類型 - 被拖動(dòng)的文件的路徑。

被拖動(dòng)的文件拖動(dòng)到托盤圖標(biāo)里面的時(shí)候被分發(fā)陪汽。

事件: 'drop-text' MacOS

  • event Event類型
  • text String類型 - 被拖動(dòng)的文本字符串训唱。

被拖動(dòng)的文本拖動(dòng)到托盤圖標(biāo)里面的時(shí)候被分發(fā)。

事件: 'drag-enter' MacOS

當(dāng)一個(gè)拖動(dòng)操作進(jìn)入到托盤圖標(biāo)的時(shí)候被分發(fā)挚冤。

事件: 'drag-leave' MacOS

當(dāng)一個(gè)拖動(dòng)操作離開托盤圖標(biāo)的時(shí)候被分發(fā)况增。

事件: 'drag-end' MacOS

當(dāng)拖動(dòng)操作在托盤圖標(biāo)上釋放或在其他的位置釋放時(shí)被分發(fā)。

實(shí)例的方法

Tray類有以下方法:

tray.destroy()

立刻銷毀托盤圖標(biāo)训挡。

tray.setImage(image)

設(shè)置托盤圖標(biāo)澳骤。

tray.setPressedImage(image) MacOS

設(shè)置MacOS下按下托盤圖標(biāo)是的托盤圖標(biāo)。

tray.setToolTip(toolTip)

  • toolTip String類型

設(shè)置托盤圖標(biāo)的懸停文本澜薄。

tray.setTitle(title) MacOS

  • title String類型

設(shè)置顯示在狀態(tài)欄中托盤圖標(biāo)旁邊的文字为肮。

tray.setHighlightMode(mode) MacOS

  • mode String類型 - 高亮模式有以下值類型:
    • selection - 托盤圖標(biāo)被點(diǎn)擊的時(shí)候和右鍵菜單打開的時(shí)候高亮。這個(gè)是默認(rèn)值肤京。
    • always - 托盤圖標(biāo)維持高亮狀體颊艳。
    • never - 托盤圖標(biāo)沒有高亮狀態(tài)。

設(shè)置什么時(shí)候托盤的圖標(biāo)背景變成高亮狀態(tài)(藍(lán)色)忘分。

注意:當(dāng)窗口是否可見狀態(tài)改變的時(shí)候棋枕,你可以使用BrowserWindowhighlightMode'never''always'模式指尖切換。

const {BrowserWindow, Tray} = require('electron')

const win = new BrowserWindow({width: 800, height: 600})
const tray = new Tray('/path/to/my/icon')

tray.on('click', () => {
    win.isVisible() ? win.hide() : win.show()
})
win.on('show', () => {
    tray.setHighlightMode('always')
})
win.on('hide', () => {
    tray.setHighlightMode('never')
})

tray.displayBalloon(options) Windows

  • options Object類型
    • icon (NativeImage | String)類型(可選參數(shù))
    • title String類型(可選參數(shù))
    • content String類型(可選參數(shù))

展示一個(gè)托盤氣球妒峦。

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

  • menu Menu類型(可選參數(shù))
  • position Object類型(可選參數(shù))- 彈出的位置重斑。
    • x Integer
    • y Integer

彈出一個(gè)托盤圖標(biāo)的右鍵菜單。當(dāng)menu參數(shù)被設(shè)置舟山,menu將被展示代替托盤圖標(biāo)的右鍵菜單绸狐。

position只在Windows中有效,并且默認(rèn)值是(0, 0)累盗。

tray.setContextMenu(menu)

  • menu Menu類型

給這個(gè)托盤圖標(biāo)設(shè)置右鍵菜單寒矿。

tray.getBounds() MacOS Windows

返回值為Rectangle類型

作為Object的托盤圖標(biāo)的bounds

tray.isDestroyed()

返回值為Boolean類型 - 托盤圖標(biāo)是否被銷毀若债。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末符相,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子蠢琳,更是在濱河造成了極大的恐慌啊终,老刑警劉巖,帶你破解...
    沈念sama閱讀 223,126評(píng)論 6 520
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件傲须,死亡現(xiàn)場離奇詭異蓝牲,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)泰讽,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,421評(píng)論 3 400
  • 文/潘曉璐 我一進(jìn)店門例衍,熙熙樓的掌柜王于貴愁眉苦臉地迎上來昔期,“玉大人,你說我怎么就攤上這事佛玄∨鹨唬” “怎么了?”我有些...
    開封第一講書人閱讀 169,941評(píng)論 0 366
  • 文/不壞的土叔 我叫張陵梦抢,是天一觀的道長般贼。 經(jīng)常有香客問我,道長奥吩,這世上最難降的妖魔是什么哼蛆? 我笑而不...
    開封第一講書人閱讀 60,294評(píng)論 1 300
  • 正文 為了忘掉前任,我火速辦了婚禮圈驼,結(jié)果婚禮上人芽,老公的妹妹穿的比我還像新娘望几。我一直安慰自己绩脆,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,295評(píng)論 6 398
  • 文/花漫 我一把揭開白布橄抹。 她就那樣靜靜地躺著靴迫,像睡著了一般。 火紅的嫁衣襯著肌膚如雪楼誓。 梳的紋絲不亂的頭發(fā)上玉锌,一...
    開封第一講書人閱讀 52,874評(píng)論 1 314
  • 那天,我揣著相機(jī)與錄音疟羹,去河邊找鬼主守。 笑死,一個(gè)胖子當(dāng)著我的面吹牛榄融,可吹牛的內(nèi)容都是我干的参淫。 我是一名探鬼主播,決...
    沈念sama閱讀 41,285評(píng)論 3 424
  • 文/蒼蘭香墨 我猛地睜開眼愧杯,長吁一口氣:“原來是場噩夢(mèng)啊……” “哼涎才!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起力九,我...
    開封第一講書人閱讀 40,249評(píng)論 0 277
  • 序言:老撾萬榮一對(duì)情侶失蹤耍铜,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后跌前,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體棕兼,經(jīng)...
    沈念sama閱讀 46,760評(píng)論 1 321
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,840評(píng)論 3 343
  • 正文 我和宋清朗相戀三年抵乓,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了伴挚。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片蹭沛。...
    茶點(diǎn)故事閱讀 40,973評(píng)論 1 354
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖章鲤,靈堂內(nèi)的尸體忽然破棺而出摊灭,到底是詐尸還是另有隱情,我是刑警寧澤败徊,帶...
    沈念sama閱讀 36,631評(píng)論 5 351
  • 正文 年R本政府宣布帚呼,位于F島的核電站,受9級(jí)特大地震影響皱蹦,放射性物質(zhì)發(fā)生泄漏煤杀。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,315評(píng)論 3 336
  • 文/蒙蒙 一沪哺、第九天 我趴在偏房一處隱蔽的房頂上張望沈自。 院中可真熱鬧,春花似錦辜妓、人聲如沸枯途。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,797評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽酪夷。三九已至,卻和暖如春孽惰,著一層夾襖步出監(jiān)牢的瞬間晚岭,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,926評(píng)論 1 275
  • 我被黑心中介騙來泰國打工勋功, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留坦报,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 49,431評(píng)論 3 379
  • 正文 我出身青樓狂鞋,卻偏偏與公主長得像片择,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子要销,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,982評(píng)論 2 361

推薦閱讀更多精彩內(nèi)容

  • 原文:https://github.com/electron/electron/blob/master/docs/...
    Shmily落墨閱讀 19,039評(píng)論 1 5
  • 原文:https://github.com/electron/electron/blob/master/docs/...
    Shmily落墨閱讀 2,652評(píng)論 0 1
  • 原文:https://github.com/electron/electron/blob/master/docs/...
    Shmily落墨閱讀 6,139評(píng)論 0 1
  • ¥開啟¥ 【iAPP實(shí)現(xiàn)進(jìn)入界面執(zhí)行逐一顯】 〖2017-08-25 15:22:14〗 《//首先開一個(gè)線程构回,因...
    小菜c閱讀 6,453評(píng)論 0 17
  • Objective關(guān)于今天的課程/工作, 你記得什么? 心理課: 多年以前有四個(gè)學(xué)者隨著一個(gè)駝隊(duì)穿越卡瓦爾沙漠,晚...
    明睿希燦閱讀 427評(píng)論 0 0