chrome.pageAction

說明

使用 chrome.pageAction API,將圖示放在 Google Chrome 主要工具列的右側。網頁動作代表可在目前網頁上進行,但不適用於所有網頁的動作。閒置時,網頁動作會顯示為灰色。

可用性

≤MV2

以下提供一些例子:

  • 訂閱這個網頁的 RSS 動態消息
  • 使用這個網頁的相片投影播放

以下螢幕截圖中的 RSS 圖示代表網頁動作,可讓你訂閱 RSS 提供目前網頁的資訊提供。

隱藏的網頁動作會顯示為灰色。舉例來說,下方的 RSS 動態消息會顯示為灰色,因為你無法 訂閱目前網頁的資訊提供:

請考慮改用瀏覽器動作,讓使用者能與您的 。

資訊清單

擴充功能資訊清單中註冊您的網頁動作,如下所示:

{
  "name": "My extension",
  ...
  "page_action": {
    "default_icon": {                    // optional
      "16": "images/icon16.png",           // optional
      "24": "images/icon24.png",           // optional
      "32": "images/icon32.png"            // optional
    },
    "default_title": "Google Mail",      // optional; shown in tooltip
    "default_popup": "popup.html"        // optional
  },
  ...
}

由於縮放比例係數 (例如 1.5 或 1.2 倍) 的裝置越來越常見, 建議您為圖示提供多種尺寸。Chrome 會選取最接近的位置並縮放 來填滿 16 dip 空間。這也可確保圖示顯示大小有所變更時 我不需要再費心處理要提供不同的圖示!但如果大小差異太過極端 縮放後可能會導致圖示細節遺失或看起來模糊不清。

系統仍支援用於註冊預設圖示的舊版語法:

{
  "name": "My extension",
  ...
  "page_action": {
    ...
    "default_icon": "images/icon32.png"  // optional
    // equivalent to "default_icon": { "32": "images/icon32.png" }
  },
  ...
}

UI 的組成部分

網頁動作和瀏覽器動作一樣,可包含圖示、工具提示和彈出式視窗;然而,我們要排除 不過,此外,網頁動作也可以顯示為灰色。我們提供關於圖示、 工具提示和彈出式視窗,請參閱瀏覽器動作 UI

您使用 pageAction.showpageAction.hide 方法。根據預設,網頁動作會顯示為灰色。當您 並指定圖示的顯示位置。在分頁之前,圖示會持續顯示 關閉或開始顯示不同的網址 (例如使用者按下連結)。

提示

為了獲得最佳視覺效果,請遵守以下規定:

  • 針對只有少數網頁適用的功能,使用網頁動作。
  • 請勿將網頁動作用於適合多數網頁的功能。使用瀏覽器動作
  • 請勿持續製作圖示動畫,真煩人。

類型

ImageDataType

圖片的像素資料。必須為 ImageData 物件 (例如來自 canvas 元素)。

類型

ImageData

TabDetails

Chrome 88 以上版本

屬性

  • tabId

    編號 選填

    要查詢狀態的分頁 ID。如未指定分頁,系統會傳回非分頁專屬的狀態。

方法

getPopup()

Promise
chrome.pageAction.getPopup(
  details: TabDetails,
  callback?: function,
)

取得 html 文件集,做為此頁面動作的彈出式視窗。

參數

  • 詳細資料
  • 回呼

    函式 選用

    callback 參數如下所示:

    (result: string) => void

    • 結果

      字串

傳回

  • 承諾<字串>

    Chrome 101 以上版本

    Promise 僅適用於 Manifest V3 及以上版本,其他平台需要使用回呼。

getTitle()

Promise
chrome.pageAction.getTitle(
  details: TabDetails,
  callback?: function,
)

取得網頁動作的標題。

參數

  • 詳細資料
  • 回呼

    函式 選用

    callback 參數如下所示:

    (result: string) => void

    • 結果

      字串

傳回

  • 承諾<字串>

    Chrome 101 以上版本

    Promise 僅適用於 Manifest V3 及以上版本,其他平台需要使用回呼。

hide()

Promise
chrome.pageAction.hide(
  tabId: number,
  callback?: function,
)

隱藏網頁動作。隱藏的網頁動作仍會顯示在 Chrome 工具列中,但會顯示為灰色。

參數

  • tabId

    數字

    要修改網頁動作的分頁 ID。

  • 回呼

    函式 選用

    Chrome 67 以上版本

    callback 參數如下所示:

    () => void

傳回

  • 承諾<void>

    Chrome 101 以上版本

    Promise 僅適用於 Manifest V3 及以上版本,其他平台需要使用回呼。

setIcon()

Promise
chrome.pageAction.setIcon(
  details: object,
  callback?: function,
)

用於設定網頁動作的圖示。可以將圖示指定為圖片檔的路徑,或是畫布元素中的像素資料,或是圖示為其中一個項目的字典。必須指定 pathimageData 屬性。

參數

  • 詳細資料

    物件

    • iconIndex

      編號 選填

      已淘汰。系統已忽略此引數。

    • 圖片資料

      ImageData |物件 optional

      ImageData 物件或字典 {size ->ImageData} 代表要設定的圖示。如果將圖示指定為字典,系統會根據螢幕像素密度選擇要使用的實際圖片。如果單一螢幕空間單位的圖片像素數量等於 scale,系統會選取大小為 scale * n 的圖片像素,其中 n 是使用者介面中的圖示尺寸。至少須指定一張圖片。請注意,「details.imageData = foo」相當於 'details.imageData = {'16': foo}'

    • 路徑

      string |物件 optional

      相對圖片路徑或字典 {size ->相對圖片路徑},指向要設定的圖示。如果將圖示指定為字典,系統會根據螢幕像素密度選擇要使用的實際圖片。如果單一螢幕空間單位的圖片像素數量等於 scale,系統會選取大小為 scale * n 的圖片像素,其中 n 是使用者介面中的圖示尺寸。至少須指定一張圖片。請注意,「details.path = foo」相當於 'details.path = {'16': foo}'

    • tabId

      數字

      要修改網頁動作的分頁 ID。

  • 回呼

    函式 選用

    callback 參數如下所示:

    () => void

傳回

  • 承諾<void>

    Chrome 101 以上版本

    Promise 僅適用於 Manifest V3 及以上版本,其他平台需要使用回呼。

setPopup()

Promise
chrome.pageAction.setPopup(
  details: object,
  callback?: function,
)

設定當使用者按一下網頁動作圖示時,要以彈出式視窗開啟 HTML 文件。

參數

  • 詳細資料

    物件

    • 彈出式訊息

      字串

      在彈出式視窗中顯示的 HTML 檔案的相對路徑。如果設為空字串 (''),系統不會顯示彈出式視窗。

    • tabId

      數字

      要修改網頁動作的分頁 ID。

  • 回呼

    函式 選用

    Chrome 67 以上版本

    callback 參數如下所示:

    () => void

傳回

  • 承諾<void>

    Chrome 101 以上版本

    Promise 僅適用於 Manifest V3 及以上版本,其他平台需要使用回呼。

setTitle()

Promise
chrome.pageAction.setTitle(
  details: object,
  callback?: function,
)

設定網頁動作的標題。這會顯示在網頁動作的工具提示中。

參數

  • 詳細資料

    物件

    • tabId

      數字

      要修改網頁動作的分頁 ID。

    • title

      字串

      工具提示字串。

  • 回呼

    函式 選用

    Chrome 67 以上版本

    callback 參數如下所示:

    () => void

傳回

  • 承諾<void>

    Chrome 101 以上版本

    Promise 僅適用於 Manifest V3 及以上版本,其他平台需要使用回呼。

show()

Promise
chrome.pageAction.show(
  tabId: number,
  callback?: function,
)

顯示網頁動作。每次選取分頁時,都會顯示網頁動作。

參數

  • tabId

    數字

    要修改網頁動作的分頁 ID。

  • 回呼

    函式 選用

    Chrome 67 以上版本

    callback 參數如下所示:

    () => void

傳回

  • 承諾<void>

    Chrome 101 以上版本

    Promise 僅適用於 Manifest V3 及以上版本,其他平台需要使用回呼。

活動

onClicked

chrome.pageAction.onClicked.addListener(
  callback: function,
)

點按網頁動作圖示時觸發。如果頁面動作有彈出式視窗,則不會觸發這個事件。

參數

  • 回呼

    函式

    callback 參數如下所示:

    (tab: tabs.Tab) => void