工具列按鈕

根據工具列按鈕，這個用戶介面是一個加到瀏覽器工具列的按鈕。用戶透過點擊按鈕來與你的套件互動。

工具列按鈕與網址列按鈕非常相似。關於差別以及何時該使用的指引，詳閱工具列按鈕。

詳細指定工具列按鈕

透過在 manifest.json 中使用 browser_action 鍵來定義工具列按鈕的屬性：

json
"browser_action": {
  "default_icon": {
    "19": "button/geo-19.png",
    "38": "button/geo-38.png"
  },
  "default_title": "我在哪？"
}

唯一一個強制的鍵只有 default_icon。

指定工具列按鈕的方式有兩種： 有彈出視窗跟沒有彈出視窗。如果你不指定彈出視窗，當用戶點擊按鈕事件會被傳送到套件，而套件透過 browserAction.onClicked 監聽：

js
browser.browserAction.onClicked.addListener(handleClick);

如果你指定彈出視窗，點擊事件不會被傳送，取而代之當用戶點擊按鈕時彈出視窗會被展開。用戶可以跟彈出視窗互動且當用戶點擊了彈出視窗外側它會自動關閉。更多建立與管理彈出視窗的細節請查看彈出視窗文章。

註： 你的套件只能有一個工具列按鈕。

你可以透過 browserAction API 程式化地更改任何工具列按鈕的屬性。

圖示

更多關於建立工具列按鈕使用的圖示，請查看文件光子設計系統裡的圖示學。

範例

GitHub 上的擴充套件範例程式庫包含兩個建立工具列按鈕的範例：

  • bookmark-it 使用不含彈出視窗的工具列按鈕。
  • beastify 使用包含彈出視窗的工具列按鈕。