sidebarAction.setIcon()
Setzt das Icon für die Sidebar.
Sie können ein einzelnes Icon als entweder den Pfad zu einer Bilddatei oder einem sidebarAction.ImageDataType
-Objekt angeben.
Sie können mehrere Icons in verschiedenen Größen angeben, indem Sie ein Wörterbuch verwenden, das mehrere Pfade oder ImageData
-Objekte enthält. Dadurch muss das Icon nicht für ein Gerät mit unterschiedlicher Pixeldichte skaliert werden.
Dies ist eine asynchrone Funktion, die ein Promise
zurückgibt.
Arten von Icons
Ihre Erweiterung sollte ein Icon für die Sidebar im sidebar_action
-Manifest-Schlüssel 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
einfügen, 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
einfügen, wird das Icon nur für das angegebene Fenster gesetzt. Dieses Icon wird als "fenster-spezifisches Icon" bezeichnet und erscheint in allen Tabs dieses Fensters, für die kein tab-spezifisches Icon festgelegt ist.
Wenn Sie ein neues Icon mit setIcon()
setzen und sowohl die Optionen tabId
als auch windowId
weglassen, dann wird das "globale Icon" gesetzt. Das globale Icon erscheint dann in allen Tabs, die kein tab-spezifisches Icon gesetzt haben und deren Fenster kein fenster-spezifisches Icon hat.
Syntax
let settingIcon = browser.sidebarAction.setIcon(
details // object
)
Parameter
details
-
object
. Ein Objekt mit den folgenden Eigenschaften:imageData
Optional-
sidebarAction.ImageDataType
oderobject
. Dies ist entweder ein einzelnesImageData
-Objekt oder ein Wörterbuch-Objekt.Verwenden Sie ein Wörterbuch-Objekt, um mehrere
ImageData
-Objekte in unterschiedlichen Größen anzugeben, damit das Icon nicht für ein Gerät mit unterschiedlicher Pixeldichte skaliert werden muss. WennimageData
ein Wörterbuch ist, ist der Wert jeder Eigenschaft einImageData
-Objekt und sein Name ist seine Größe, wie folgt:jslet settingIcon = browser.action.setIcon({ imageData: { 16: image16, 32: image32, }, });
Der Browser wählt das zu verwendende Bild je nach Pixeldichte des Bildschirms aus. Siehe Wählen von Icon-Größen für mehr Informationen dazu.
path
Optional-
string
oderobject
. Dies ist entweder ein relativer Pfad zu einer Icon-Datei oder ein Wörterbuch-Objekt.Verwenden Sie ein Wörterbuch-Objekt, um mehrere Icon-Dateien in verschiedenen Größen anzugeben, damit das Icon nicht für ein Gerät mit unterschiedlicher 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:jslet settingIcon = browser.action.setIcon({ path: { 16: "path/to/image16.jpg", 32: "path/to/image32.jpg", }, });
Der Browser wählt das zu verwendende Bild je nach Pixeldichte des Bildschirms aus. Siehe Wählen von Icon-Größen für mehr Informationen dazu.
Wenn
path
ein leerer String ist, verwendet der Browser das Standard-Icon.Wenn
path
nicht leer ist, aber nicht auf eine Icon-Datei zeigt, dann wird das Icon versteckt.Wenn
path
null
ist undtabId
angegeben wurde und der angegebene Tab ein tab-spezifisches Icon hatte: dann wird das tab-spezifische Icon auf das globale Icon zurückgesetzt (falls ein globales Icon gesetzt ist) oder das Manifest-Icon.Wenn
path
null
ist undtabId
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 sowohl
windowId
als auchtabId
angegeben sind, schlägt die Funktion fehl und das Icon wird nicht gesetzt. - Wenn sowohl
windowId
als auchtabId
weggelassen werden, wird das Icon global gesetzt.
Rückgabewert
Ein Promise
, das ohne Argumente erfüllt wird, sobald das Icon gesetzt wurde.
Browser-Kompatibilität
BCD tables only load in the browser
Beispiele
Der folgende Code wechselt das Sidebar-Icon für den aktiven Tab, wenn der Benutzer auf eine Browser-Aktion 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);
Hinweis:
Diese API basiert auf Operas chrome.sidebarAction
API.