Wdrażanie działania

Działanie to kliknięcie przez użytkownika ikony na pasku narzędzi (zwykle jest to ikona działania rozszerzenia). Czynność wywołuje funkcję rozszerzenia za pomocą interfejsu Action API lub otwiera wyskakujące okienko. Na tej stronie pokazujemy, jak wywołać funkcję rozszerzenia. Instrukcje korzystania z wyskakujących okienka znajdziesz w sekcji Dodawanie wyskakującego okienka.

Zarejestruj działanie

Aby użyć interfejsu API chrome.action, dodaj klucz "action" do pliku manifestu rozszerzenia. Pełny opis opcjonalnych właściwości tego pola znajdziesz w sekcji manifestu w dokumentacji interfejsu API chrome.action.

manifest.json:

{
  "name": "My Awesome action Extension",
 ...
  "action": {
   ...
  }
 ...
}

Reaguj na działanie

Zarejestruj moduł obsługi onClicked na potrzeby kliknięcia ikony działania przez użytkownika. To zdarzenie nie jest wywoływane, jeśli w pliku manifest.json zarejestrowane jest wyskakujące okienko.

Skrypt service worker.js:

chrome.action.onClicked.addListener((tab) => {
  chrome.action.setTitle({
    tabId: tab.id,
    title: `You are on tab: ${tab.id}`});
});

Warunkowe aktywowanie działania

Interfejs API chrome.declarativeContent pozwala włączyć ikonę działania rozszerzenia na podstawie adresu URL strony lub sytuacji, gdy selektory arkusza CSS pasują do elementów na stronie. Gdy ikona działania rozszerzenia jest wyłączona, jest ona wyszarzona. Jeśli użytkownik kliknie ikonę wyłączonego rozszerzenia, wyświetli się menu kontekstowe rozszerzenia.

Ikona wyłączonego działania
Ikona wyłączonego działania.

Plakietka działania

Plakietki to fragmenty sformatowanego tekstu umieszczone nad ikoną działania, które informują m.in. o stanie rozszerzenia lub działaniach użytkownika. Aby to zademonstrować, przykładowa reklama Pij wodę ma plakietkę „WŁ.”, która oznacza, że użytkownik ustawił alarm, i nie wyświetla żadnych informacji, gdy rozszerzenie jest nieaktywne. Plakietki mogą zawierać maksymalnie cztery znaki.

Ikona rozszerzenia bez plakietki i z plakietką.
Ikona rozszerzenia bez plakietki (po lewej) i z plakietką (po prawej).

Ustaw tekst plakietki, wywołując chrome.action.setBadgeText(), oraz kolor tła, wywołując chrome.action.setBadgeBackgroundColor()`.

Skrypt service worker.js:

chrome.action.setBadgeText({text: 'ON'});
chrome.action.setBadgeBackgroundColor({color: '#4688F1'});

Etykietka

Zarejestruj etykietki w polu "default_title" pod kluczem "action" w pliku manifest.json.

manifest.json:

{
  "name": "Tab Flipper",
 ...
  "action": {
    "default_title": "Press Ctrl(Win)/Command(Mac)+Shift+Right/Left to flip tabs"
  }
...
}

Możesz też ustawiać lub aktualizować etykietki, wywołując metodę action.setTitle()`. Jeśli etykietka nie jest ustawiona, pojawi się nazwa rozszerzenia.