Wdrażanie działania

Czynność to kliknięcie przez użytkownika ikony na pasku narzędzi (zwykle nazywanej ikoną działania rozszerzenia). Działanie wywołuje funkcję rozszerzenia za pomocą interfejsu Action API lub otwiera wyskakujące okienko. Na tej stronie dowiesz się, jak wywołać funkcję rozszerzenia. Jeśli chcesz użyć wyskakującego okienka, zobacz Dodawanie wyskakującego okienka.

Zarejestruj działanie

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

manifest.json:

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

Reaguj na działanie

Zarejestruj moduł obsługi onClicked, gdy użytkownik kliknie ikonę działania. To zdarzenie nie jest wywoływane, jeśli w pliku manifest.json zarejestrowane jest wyskakujące okienko.

Serviceworker.js:

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

Warunkowe aktywowanie działania

Interfejs chrome.declarativeContent API umożliwia włączenie ikony działania rozszerzenia na podstawie adresu URL strony lub 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 tę ikonę, pojawi się menu kontekstowe rozszerzenia.

Ikona wyłączonej czynności.

Plakietka działania

Plakietki to fragmenty sformatowanego tekstu umieszczane nad ikoną działania, które wskazuje np. stan rozszerzenia lub informację, że użytkownik musi wykonać określone działanie. Aby to zademonstrować, próbka Drink Water wyświetla plakietkę z oznaczeniem „WŁĄCZONE”. , aby pokazać użytkownikowi, że udało się ustawić alarm, i nic nie wyświetla, gdy rozszerzenie jest nieaktywne. Plakietki mogą zawierać maksymalnie 4 znaki.

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

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

Serviceworker.js:

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

Etykietka

Zarejestruj etykietki w polu "default_title" w kluczu "action" w pliku manifest.json.

manifest.json:

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

Etykietki możesz też ustawiać lub aktualizować, wywołując metodę action.setTitle()`. Jeśli etykietka nie zostanie ustawiona, wyświetli się nazwa rozszerzenia.