sidebarAction.setIcon()

Arten von Icons

Ihre Erweiterung sollte ein Icon für die Seitenleiste im manifest-Schlüssel sidebar_action angeben. Dies wird als "Manifest-Icon" bezeichnet.

Wenn Sie kein Icon im sidebar_action-Schlüssel angeben, erhalten Sie das Standard-Icon des Browsers. Dies wird als "Standard-Icon" bezeichnet.

Wenn Sie ein neues Icon mit setIcon() setzen und die Option tabId einschließen, wird das Icon nur für den angegebenen Tab gesetzt. Dieses Icon wird als "tab-spezifisches Icon" bezeichnet.

Wenn Sie ein neues Icon mit setIcon() setzen und die Option windowId einschließen, wird das Icon nur für das angegebene Fenster gesetzt. Dieses Icon wird als "fensterspezifisches Icon" bezeichnet und wird in allen Tabs dieses Fensters erscheinen, die kein tab-spezifisches Icon gesetzt haben.

Wenn Sie ein neues Icon mit setIcon() setzen und sowohl die tabId als auch die windowId Optionen weglassen, dann wird das "globale Icon" gesetzt. Das globale Icon erscheint dann in allen Tabs, die kein tab-spezifisches Icon setzen und deren Fenster kein fensterspezifisches Icon besitzen.

Syntax

let settingIcon = browser.sidebarAction.setIcon(
  details         // object
)

Parameter

details

object. Ein Objekt mit den folgenden Eigenschaften:

imageData Optional

sidebarAction.ImageDataType oder object. Dies ist entweder ein einzelnes ImageData-Objekt oder ein Wörterbuchobjekt.

Verwenden Sie ein Wörterbuchobjekt, um mehrere ImageData-Objekte in verschiedenen Größen anzugeben, so dass das Icon nicht für ein Gerät mit einer anderen Pixeldichte skaliert werden muss. Wenn imageData ein Wörterbuch ist, ist der Wert jeder Eigenschaft ein ImageData-Objekt, und sein Name ist seine Größe, wie folgt:

js

let settingIcon = browser.sidebarAction.setIcon({
  imageData: {
    16: image16,
    32: image32,
  },
});

Der Browser wählt das Bild basierend auf der Pixeldichte des Bildschirms aus. Siehe Choosing icon sizes für weitere Informationen dazu.

path Optional

string oder object. Dies ist entweder ein relativer Pfad zu einer Icon-Datei oder ein Wörterbuchobjekt.

Verwenden Sie ein Wörterbuchobjekt, um mehrere Icon-Dateien in verschiedenen Größen anzugeben, so dass das Icon nicht für ein Gerät mit einer anderen Pixeldichte skaliert werden muss. Wenn path ein Wörterbuch ist, ist der Wert jeder Eigenschaft ein relativer Pfad, und sein Name ist seine Größe, wie folgt:

js

let settingIcon = browser.sidebarAction.setIcon({
  path: {
    16: "path/to/image16.jpg",
    32: "path/to/image32.jpg",
  },
});

Der Browser wählt das Bild basierend auf der Pixeldichte des Bildschirms aus. Siehe Choosing icon sizes für weitere Informationen dazu.

Wenn path eine leere Zeichenkette ist, verwendet der Browser das Standard-Icon.

Wenn path nicht leer ist, aber nicht auf eine Icon-Datei zeigt, wird das Icon ausgeblendet.

Wenn path null ist und tabId angegeben wurde und der angegebene Tab ein tab-spezifisches Icon hatte: dann wird das tab-spezifische Icon auf das globale Icon zurückgesetzt (wenn ein globales Icon gesetzt ist) oder auf das Manifest-Icon.

Wenn path null ist, tabId weggelassen wurde und ein globales Icon gesetzt war, wird es auf das Manifest-Icon zurückgesetzt.

tabId Optional

integer. Setzt das Icon nur für den angegebenen Tab.

windowId Optional

integer. Setzt das Icon nur für das angegebene Fenster.

• Wenn windowId und tabId beide angegeben sind, schlägt die Funktion fehl und das Icon wird nicht gesetzt.
• Wenn windowId und tabId beide weggelassen werden, wird das Icon global gesetzt.

Rückgabewert

Ein Promise, der ohne Argumente erfüllt wird, sobald das Icon gesetzt wurde.

Beispiele

Der folgende Code schaltet das Icon der Seitenleiste für den aktiven Tab um, wenn der Benutzer auf ein Browser-Action-Element klickt:

let on = false;

function toggle(tab) {
  if (on) {
    browser.sidebarAction.setIcon({
      path: "off.svg",
      tabId: tab.id,
    });
    on = false;
  } else {
    browser.sidebarAction.setIcon({
      path: "on.svg",
      tabId: tab.id,
    });
    on = true;
  }
}

browser.browserAction.onClicked.addListener(toggle);

Browser-Kompatibilität