Ta strona została przetłumaczona przez Cloud Translation API.

chrome.browserAction

Opis

Użyj działań przeglądarki, aby umieścić ikony na głównym pasku narzędzi Google Chrome, po prawej stronie paska adresu. Oprócz ikony działanie w przeglądarce może mieć etykietkę, plakietkę i wyskakujące okienko.

Dostępność

&leq; MV2

Na tej ilustracji wielokolorowy kwadrat po prawej stronie paska adresu jest ikoną działanie przeglądarki. Pod ikoną znajduje się wyskakujące okienko.

Jeśli chcesz utworzyć ikonę, która nie zawsze jest aktywna, użyj działania na stronie, a nie przeglądarki. działania.

Plik manifestu

Zarejestruj działanie przeglądarki w pliku manifestu rozszerzenia w ten sposób:

{
  "name": "My extension",
  ...
  "browser_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
  },
  ...
}

Możesz podać dowolną ikonę rozmiaru do użycia w Chrome, a Chrome wybierze najbliższą z nich i dostosuje skalowanie do odpowiednich 16 pikseli. Jeśli jednak nie zostanie podany dokładny rozmiar, Może to spowodować utratę szczegółów lub rozmycie obrazu.

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. Zapewnia to też, że rozmiar ikony się zmienia, nie musisz nic więcej robić, aby wybrać inne ikony.

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

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

Części interfejsu użytkownika

Działanie w przeglądarce może mieć ikonę, etykietkę, plakietkę i wyskakujące okienko.

Ikona

Ikony działań w przeglądarce w Chrome mają 16 spadków (piksele niezależne od urządzenia) o szerokości i wysokiej wysokości. Większy rozmiar ikon jest zmieniany, aby dopasować, ale dla uzyskania najlepszych wyników należy użyć kwadratowej ikony o długości 16 pikseli.

Możesz ustawić ikonę na 2 sposoby: używając obrazu statycznego lub elementu canvas HTML5. Zastosowanie statyczne obrazy są łatwiejsze w prostych aplikacjach, ale można też tworzyć bardziej dynamiczne interfejsy użytkownika, np. gdy użyjesz elementu canvas.

Obrazy statyczne mogą mieć dowolny format obsługiwany przez WebKit, w tym BMP, GIF, ICO, JPEG lub PNG. Dla: rozszerzeń, obrazy muszą być w formacie PNG.

Aby ustawić ikonę, użyj pola default_icon parametru default_icon w manifestu lub wywołaj metody browserAction.setIcon.

Aby ikona wyświetlała się prawidłowo, gdy gęstość pikseli na ekranie (współczynnik size_in_pixel / size_in_dip) to innej niż 1, ikona może być zdefiniowana jako zbiór obrazów o różnych rozmiarach. Rzeczywisty obraz do Wyświetlacz zostanie wybrany z zestawu, który najlepiej pasuje do rozmiaru 16 pikseli. Zestaw ikon może zawierać dowolną specyfikację rozmiaru, a Chrome wybierze tę najbardziej odpowiednią.

Aby ustawić etykietkę, użyj pola default_title parametru browser_action w pliku manifest lub wywoływać metodę browserAction.setTitle. W przypadku parametru default_title; Szczegóły znajdziesz w artykule Internacjonalizacja.

Plakietka

Działania w przeglądarce mogą opcjonalnie wyświetlać plakietkę, czyli fragment tekstu nałożony na ikonę. Plakietki ułatwiają aktualizowanie działania przeglądarki, aby wyświetlić niewielką ilość informacji na temat o jego stanie.

Plakietka ma ograniczoną ilość miejsca, więc powinna mieć maksymalnie 4 znaki.

Ustaw tekst i kolor plakietki za pomocą: browserAction.setBadgeText oraz browserAction.setBadgeBackgroundColor.

Jeśli działanie przeglądarki zawiera wyskakujące okienko, pojawia się, gdy użytkownik kliknie ikonę rozszerzenia. Wyskakujące okienko może zawierać dowolną treść w języku HTML, a jego rozmiar jest automatycznie dopasowywany do zawartości. Wyskakujące okienko nie może być mniejsze niż 25 x 25 ani większe niż 800 x 600.

Aby dodać wyskakujące okienko do działania przeglądarki, utwórz plik HTML z zawartością tego okienka. Podaj wartość pliku HTML w polu default_popup parametru browser_action w pliku manifest lub wywołaj metodę Metoda browserAction.setPopup.

Wskazówki

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

Używaj działań w przeglądarce, aby korzystać z funkcji, które działają na większości stron.
Nie używaj działań przeglądarki do obsługi funkcji, które mają sens tylko na kilku stronach. Użyj strony działań.
Używaj dużych, kolorowych ikon, które najlepiej wykorzystują rozmiar 16 x 16 pikseli. Ikony czynności przeglądarki wydają się większe i większe niż ikony działań na stronie.
Nie próbuj naśladować ikony menu monochromatycznego Google Chrome. Nie działa to dobrze motywy, mimo to rozszerzenia powinny się nieco wyróżnić.
Używaj przezroczystości alfa, aby dodać do ikony miękkie krawędzie. Wiele osób korzysta z motywów, ikona powinna wyglądać ładnie na różnych kolorach tła.
Nie stale animuj ikony. To tylko irytujące.

Przykłady

Proste przykłady użycia działań przeglądarki znajdziesz tutaj: examples/api/browserAction. katalogu. Inne przykłady i pomoc w wyświetlaniu kodu źródłowego znajdziesz w przykładach.

Typy

ColorArray

Typ

[liczba, liczba, liczba, liczba]

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

disable()

Obietnica .

chrome.browserAction.disable(
  tabId?: number,
  callback?: function,
)

Wyłącza działanie przeglądarki dla karty.

Parametry

tabId

liczba opcjonalnie

Identyfikator karty, dla której chcesz zmienić działanie przeglądarki.
wywołanie zwrotne

funkcja optional

Chrome w wersji 67 lub nowszej .

Parametr callback wygląda tak:
```
() => void
```

Zwroty

Obietnica<void>

Chrome 88 i nowsze .

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

enable()

Obietnica .

chrome.browserAction.enable(
  tabId?: number,
  callback?: function,
)

Włącza działanie przeglądarki dla karty. Domyślnie włączone.

Parametry

tabId

liczba opcjonalnie

Identyfikator karty, dla której chcesz zmienić działanie przeglądarki.
wywołanie zwrotne

funkcja optional

Chrome w wersji 67 lub nowszej .

Parametr callback wygląda tak:
```
() => void
```

Zwroty

Obietnica<void>

Chrome 88 i nowsze .

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

getBadgeBackgroundColor()

Obietnica .

chrome.browserAction.getBadgeBackgroundColor(
  details: TabDetails,
  callback?: function,
)

Pobiera kolor tła działania przeglądarki.

Parametry

szczegóły

TabDetails
wywołanie zwrotne

funkcja optional

Parametr callback wygląda tak:
```
(result: ColorArray) => void
```
- wynik
  
  ColorArray

Zwroty

Promise<ColorArray>

Chrome 88 i nowsze .

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

getBadgeText()

Obietnica .

chrome.browserAction.getBadgeText(
  details: TabDetails,
  callback?: function,
)

Pobiera tekst plakietki działania przeglądarki. Jeśli nie podasz żadnej karty, zwracany będzie tekst plakietki niezwiązany z żadną kartą.

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 88 i nowsze .

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

getPopup()

Obietnica .

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

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

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 88 i nowsze .

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

getTitle()

Obietnica .

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

Pobiera tytuł działania w przeglądarce.

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 88 i nowsze .

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

setBadgeBackgroundColor()

Obietnica .

chrome.browserAction.setBadgeBackgroundColor(
  details: object,
  callback?: function,
)

Ustawia kolor tła plakietki.

Parametry

szczegóły

Obiekt
- kolor
  
  string | ColorArray
  
  Tablica z czterema liczbami całkowitymi z zakresu od 0 do 255, które składają się na kolor RGBA plakietki. Może to być też ciąg znaków z szesnastkową wartością koloru CSS. np. #FF0000 lub #F00 (czerwony). Renderuje kolory z pełną nieprzezroczystością.
- tabId
  
  liczba opcjonalnie
  
  Ogranicza zmiany do momentu, gdy zostanie wybrana dana karta. Jest automatycznie resetowany po zamknięciu karty.
wywołanie zwrotne

funkcja optional

Chrome w wersji 67 lub nowszej .

Parametr callback wygląda tak:
```
() => void
```

Zwroty

Obietnica<void>

Chrome 88 i nowsze .

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

setBadgeText()

Obietnica .

chrome.browserAction.setBadgeText(
  details: object,
  callback?: function,
)

Ustawia tekst plakietki dla działania przeglądarki. Plakietka jest wyświetlana nad ikoną.

Parametry

szczegóły

Obiekt
- tabId
  
  liczba opcjonalnie
  
  Ogranicza zmiany do momentu, gdy zostanie wybrana dana karta. Jest automatycznie resetowany po zamknięciu karty.
- tekst
  
  ciąg znaków opcjonalny
  
  Można przekazać dowolną liczbę znaków, ale miejsce zmieści się tylko około 4. Jeśli zostanie podany pusty ciąg znaków (''), tekst plakietki zostanie wyczyszczony. Jeśli określono tabId, a text ma wartość null, tekst na określonej karcie zostanie wyczyszczony i domyślnie jest wyświetlany globalny tekst plakietki.
wywołanie zwrotne

funkcja optional

Chrome w wersji 67 lub nowszej .

Parametr callback wygląda tak:
```
() => void
```

Zwroty

Obietnica<void>

Chrome 88 i nowsze .

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

setIcon()

Obietnica .

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

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

Parametry

szczegóły

Obiekt
- Dane_obrazów
  
  ImageData | obiekt opcjonalny
  
  Obiekt ImageData lub słownik {size -> ImageData} reprezentujące ikonę do ustawienia. Jeśli ikona jest określona jako słownik, użyty obraz 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, użyty obraz 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 opcjonalnie
  
  Ogranicza zmiany do momentu, gdy zostanie wybrana dana karta. Jest automatycznie resetowany po zamknięciu karty.
wywołanie zwrotne

funkcja optional

Parametr callback wygląda tak:
```
() => void
```

Zwroty

Obietnica<void>

Chrome 116 lub nowszy .

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

setPopup()

Obietnica .

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

Konfiguruje otwieranie dokumentu HTML jako wyskakującego okienka, gdy użytkownik kliknie ikonę czynności w przeglądarce.

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 opcjonalnie
  
  Ogranicza zmiany do momentu, gdy zostanie wybrana dana karta. Jest automatycznie resetowany po zamknięciu karty.
wywołanie zwrotne

funkcja optional

Chrome w wersji 67 lub nowszej .

Parametr callback wygląda tak:
```
() => void
```

Zwroty

Obietnica<void>

Chrome 88 i nowsze .

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

setTitle()

Obietnica .

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

Określa tytuł działania w przeglądarce. Ten tytuł jest widoczny w etykietce.

Parametry

szczegóły

Obiekt
- tabId
  
  liczba opcjonalnie
  
  Ogranicza zmiany do momentu, gdy zostanie wybrana dana karta. Jest automatycznie resetowany po zamknięciu karty.
- tytuł
  
  ciąg znaków
  
  Ciąg tekstowy, który ma wyświetlić działanie przeglądarki po najechaniu na nie kursorem myszy.
wywołanie zwrotne

funkcja optional

Chrome w wersji 67 lub nowszej .

Parametr callback wygląda tak:
```
() => void
```

Zwroty

Obietnica<void>

Chrome 88 i nowsze .

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

Wydarzenia

onClicked

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

Uruchamiane po kliknięciu ikony działania w przeglądarce. Nie uruchamia się, jeśli działanie przeglądarki zawiera wyskakujące okienko.

Parametry

wywołanie zwrotne

funkcja

Parametr callback wygląda tak:
```
(tab: tabs.Tab) => void
```
- tabulator
  
  tabs.Tab

chrome.browserAction

Opis

Dostępność

Plik manifestu

Części interfejsu użytkownika

Ikona

Etykietka

Plakietka

Wyskakujące okienko

Wskazówki

Przykłady

Typy

ColorArray

Typ

ImageDataType

Typ

TabDetails

Właściwości

Metody

disable()

Parametry

Zwroty

enable()

Parametry

Zwroty

getBadgeBackgroundColor()

Parametry

Zwroty

getBadgeText()

Parametry

Zwroty

getPopup()

Parametry

Zwroty

getTitle()

Parametry

Zwroty

setBadgeBackgroundColor()

Parametry

Zwroty

setBadgeText()

Parametry

Zwroty

setIcon()

Parametry

Zwroty

setPopup()

Parametry

Zwroty

setTitle()

Parametry

Zwroty

Wydarzenia

onClicked

Parametry