chrome.pageAction

Opis

Użyj interfejsu API chrome.pageAction, aby umieścić ikony na głównym pasku narzędzi Google Chrome po prawej stronie paska adresu. Działania na stronie to działania, które można wykonać na bieżącej stronie, ale nie na wszystkich stronach. Działania na stronie są wyszarzone, gdy są nieaktywne.

Dostępność

≤ MV2

Oto kilka przykładów:

  • Zasubskrybuj kanał RSS tej strony
  • Utwórz pokaz slajdów ze zdjęć z tej strony

Ikona RSS na zrzucie ekranu poniżej przedstawia działanie na stronie, które pozwala zasubskrybować kanał RSS kanału bieżącej strony.

Ukryte działania na stronie są wyszarzone. Na przykład poniższy kanał RSS jest wyszarzony, zasubskrybuj kanał bieżącej strony:

Rozważ użycie działania przeglądarki, aby użytkownicy zawsze mogli wchodzić w interakcję z Twoją .

Plik manifestu

Zarejestruj działanie strony w pliku manifestu rozszerzenia w ten sposób:

{
  "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
  },
  ...
}

Urządzenia o mniej powszechnych współczynnikach skali, takich jak 1,5x czy 1,2x, stają się coraz bardziej popularne, zachęca do stosowania ikon w różnych rozmiarach. Chrome wybierze najbliższy i przeskaluje go aby wypełnić przestrzeń o 16 kropkach. Dzięki temu w razie zmiany rozmiaru wyświetlanych ikon nie można muszą zrobić coś więcej, żeby dodać inne ikony. Jeśli jednak różnica w rozmiarze jest zbyt duża, może to spowodować utratę szczegółów lub rozmycie obrazu.

Nadal obsługiwana jest stara składnia rejestrowania ikony domyślnej:

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

Części interfejsu użytkownika

Podobnie jak działania w przeglądarce działania na stronie mogą mieć ikonę, etykietkę i wyskakujące okienko. nie mogą mieć odznak, . Działania na stronie mogą być wyszarzone. Informacje na temat ikon, etykietki i wyskakujące okienka, zapoznaj się z informacjami o interfejsie działania przeglądarki.

wyświetlenie i wyszarzenie strony za pomocą przycisków pageAction.show i pageAction.hide. Domyślnie działania na stronie są wyszarzone. Gdy możesz określić kartę, na której ikona ma się pojawić. Ikona pozostanie widoczna do momentu pojawienia się karty została zamknięta lub zaczyna wyświetlać inny adres URL (np. dlatego, że użytkownik klika link).

Wskazówki

Aby uzyskać najlepszy efekt wizualny, stosuj się do tych wskazówek:

  • Używaj działań na stronach w przypadku funkcji, które działają tylko na kilku stronach.
  • Nie używaj działań na stronie w przypadku funkcji, które sprawdzają się na większości stron. Używaj działań przeglądarki .
  • Nie stale animuj ikony. To tylko irytujące.

Typy

ImageDataType

Dane pikselowe dla obrazu. Musi to być obiekt ImageData (np. z elementu canvas).

Typ

ImageData

TabDetails

Chrome 88 i nowsze .

Właściwości

  • tabId

    liczba opcjonalnie

    Identyfikator karty, której stan ma dotyczyć zapytanie. Jeśli nie podasz żadnej karty, zwrócony zostanie stan niepowiązany z żadną kartą.

Metody

getPopup()

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

Pobiera dokument HTML ustawiony jako wyskakujące okienko dla tego działania strony.

Parametry

  • szczegóły

    TabDetails

  • wywołanie zwrotne

    funkcja optional

    Parametr callback wygląda tak: 

    (result: string) => void

    • wynik

      ciąg znaków

Zwroty

  • Obietnica<ciąg>

    Chrome 101 i nowsze wersje .

    Obietnice są obsługiwane tylko na platformie Manifest V3 i nowszych, inne platformy muszą używać wywołań zwrotnych.

getTitle()

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

Pobiera tytuł działania na stronie.

Parametry

  • szczegóły

    TabDetails

  • wywołanie zwrotne

    funkcja optional

    Parametr callback wygląda tak: 

    (result: string) => void

    • wynik

      ciąg znaków

Zwroty

  • Obietnica<ciąg>

    Chrome 101 i nowsze wersje .

    Obietnice są obsługiwane tylko na platformie Manifest V3 i nowszych, inne platformy muszą używać wywołań zwrotnych.

hide()

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

Ukrywa działanie na stronie. Ukryte działania na stronach są nadal widoczne na pasku narzędzi Chrome, ale są wyszarzone.

Parametry

  • tabId

    liczba

    Identyfikator karty, dla której chcesz zmienić działanie na stronie.

  • wywołanie zwrotne

    funkcja optional

    Chrome w wersji 67 lub nowszej .

    Parametr callback wygląda tak: 

    () => void

Zwroty

  • Obietnica<void>

    Chrome 101 i nowsze wersje .

    Obietnice są obsługiwane tylko na platformie Manifest V3 i nowszych, inne platformy muszą używać wywołań zwrotnych.

setIcon()

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

Ustawia ikonę działania na stronie. Ikonę można określić jako ścieżkę do pliku graficznego, jako dane piksela z elementu canvas lub jako słownik jednego z tych elementów. Należy określić właściwość path lub imageData.

Parametry

  • szczegóły

    Obiekt

    • iconIndex

      liczba opcjonalnie

      Wycofano. Ten argument jest ignorowany.

    • Dane_obrazów

      ImageData | obiekt opcjonalny

      Obiekt ImageData lub słownik {size -> ImageData} reprezentującego ikonę do ustawienia. Jeśli ikona jest określona jako słownik, obraz do użycia jest dobierany w zależności od gęstości pikseli na ekranie. Jeśli liczba pikseli obrazu, które mieszczą się w jednej jednostce obszaru ekranu, wynosi scale, zostanie wybrany obraz o rozmiarze scale * n, gdzie n to rozmiar ikony w interfejsie. Musisz określić co najmniej jeden obraz. Pamiętaj, że „details.imageData = foo” jest odpowiednikiem „details.imageData = {'16': foo}”

    • ścieżka

      string | obiekt opcjonalny

      Względna ścieżka obrazu lub słownik {size -> względna ścieżka obrazu} wskazująca ikonę do ustawienia. Jeśli ikona jest określona jako słownik, obraz do użycia jest dobierany w zależności od gęstości pikseli na ekranie. Jeśli liczba pikseli obrazu, które mieszczą się w jednej jednostce obszaru ekranu, wynosi scale, zostanie wybrany obraz o rozmiarze scale * n, gdzie n to rozmiar ikony w interfejsie. Musisz określić co najmniej jeden obraz. Pamiętaj, że „details.path = foo” jest odpowiednikiem „details.path = {'16': foo}”

    • tabId

      liczba

      Identyfikator karty, dla której chcesz zmienić działanie na stronie.

  • wywołanie zwrotne

    funkcja optional

    Parametr callback wygląda tak: 

    () => void

Zwroty

  • Obietnica<void>

    Chrome 101 i nowsze wersje .

    Obietnice są obsługiwane tylko na platformie Manifest V3 i nowszych, inne platformy muszą używać wywołań zwrotnych.

setPopup()

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

Konfiguruje otwieranie dokumentu HTML jako wyskakującego okienka, gdy użytkownik kliknie ikonę działania na stronie.

Parametry

  • szczegóły

    Obiekt

    • wyskakujące okienko

      ciąg znaków

      Ścieżka względna do pliku HTML wyświetlana w wyskakującym okienku. Jeśli ustawisz wartość na pusty ciąg (''), wyskakujące okienko się nie wyświetli.

    • tabId

      liczba

      Identyfikator karty, dla której chcesz zmienić działanie na stronie.

  • wywołanie zwrotne

    funkcja optional

    Chrome w wersji 67 lub nowszej .

    Parametr callback wygląda tak: 

    () => void

Zwroty

  • Obietnica<void>

    Chrome 101 i nowsze wersje .

    Obietnice są obsługiwane tylko na platformie Manifest V3 i nowszych, inne platformy muszą używać wywołań zwrotnych.

setTitle()

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

Określa tytuł działania na stronie. Wyświetlana w etykietce nad działaniem strony.

Parametry

  • szczegóły

    Obiekt

    • tabId

      liczba

      Identyfikator karty, dla której chcesz zmienić działanie na stronie.

    • tytuł

      ciąg znaków

      Ciąg etykietki.

  • wywołanie zwrotne

    funkcja optional

    Chrome w wersji 67 lub nowszej .

    Parametr callback wygląda tak: 

    () => void

Zwroty

  • Obietnica<void>

    Chrome 101 i nowsze wersje .

    Obietnice są obsługiwane tylko na platformie Manifest V3 i nowszych, inne platformy muszą używać wywołań zwrotnych.

show()

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

Pokazuje czynność strony. Czynność na stronie jest widoczna po każdym wybraniu karty.

Parametry

  • tabId

    liczba

    Identyfikator karty, dla której chcesz zmienić działanie na stronie.

  • wywołanie zwrotne

    funkcja optional

    Chrome w wersji 67 lub nowszej .

    Parametr callback wygląda tak: 

    () => void

Zwroty

  • Obietnica<void>

    Chrome 101 i nowsze wersje .

    Obietnice są obsługiwane tylko na platformie Manifest V3 i nowszych, inne platformy muszą używać wywołań zwrotnych.

Wydarzenia

onClicked

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

Uruchamiane po kliknięciu ikony działania na stronie. To zdarzenie nie uruchomi się, jeśli dla działania na stronie pojawia się wyskakujące okienko.

Parametry

  • wywołanie zwrotne

    funkcja

    Parametr callback wygląda tak: 

    (tab: tabs.Tab) => void