aboutsummaryrefslogtreecommitdiff
path: root/files/fr/mozilla/add-ons/webextensions/api/sidebaraction/seticon/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/fr/mozilla/add-ons/webextensions/api/sidebaraction/seticon/index.html')
-rw-r--r--files/fr/mozilla/add-ons/webextensions/api/sidebaraction/seticon/index.html137
1 files changed, 137 insertions, 0 deletions
diff --git a/files/fr/mozilla/add-ons/webextensions/api/sidebaraction/seticon/index.html b/files/fr/mozilla/add-ons/webextensions/api/sidebaraction/seticon/index.html
new file mode 100644
index 0000000000..1b0f7e3352
--- /dev/null
+++ b/files/fr/mozilla/add-ons/webextensions/api/sidebaraction/seticon/index.html
@@ -0,0 +1,137 @@
+---
+title: sidebarAction.setIcon()
+slug: Mozilla/Add-ons/WebExtensions/API/sidebarAction/setIcon
+tags:
+ - API
+ - Add-ons
+ - Extensions
+ - Method
+ - Reference
+ - WebExtensions
+ - setIcon
+ - sidebarAction
+translation_of: Mozilla/Add-ons/WebExtensions/API/sidebarAction/setIcon
+---
+<div>{{AddonSidebar()}}</div>
+
+<p>Définit l'icône de la barre latérale.</p>
+
+<p>Vous pouvez spécifier une icône unique comme chemin d'accès à un fichier image ou un objet {{WebExtAPIRef('sidebarAction.ImageDataType')}}.</p>
+
+<p>Vous pouvez spécifier plusieurs icônes de différentes tailles en fournissant un dictionnaire contenant plusieurs chemins ou objets <code>ImageData</code>. Cela signifie que l'icône ne doit pas être mise à l'échelle pour un périphérique avec une densité de pixels différente.</p>
+
+<p>C'est une fonction asynchrone qui renvoie une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code>.</p>
+
+<h2 id="Types_d'icônes">Types d'icônes</h2>
+
+<p>Votre extension doit spécifier une icône pour la barre latérale dans la clé de manifest <a href="/fr/Add-ons/WebExtensions/manifest.json/sidebar_action">sidebar_action</a>. C'est ce qu'on appelle <em>"manifest icon"</em>.</p>
+
+<p>Si vous ne spécifiez pas d'icône dans la clé sidebar_action, vous obtenez l'icône par défaut du navigateur. C'est ce qu'on appelle <em>"default icon"</em>.</p>
+
+<p>Si vous définissez une nouvelle icône en utilisant <code>setIcon()</code>, et incluez l'option <code>tabId</code> , l'icône est définie uniquement pour l'onglet donné. C'est ce qu'on appelle <em>"tab-specific icon"</em>.</p>
+
+<p>Si vous définissez une nouvelle icône en utilisant <code>setIcon()</code>, et incluez l'option <code>windowId</code>, alors l'icône n'est définie que pour la fenêtre donnée. Cette icône est appelée <em>"icône spécifique à la fenêtre"</em>, et apparaîtra dans tous les onglets de cette fenêtre qui n'ont pas de jeu d'icônes spécifiques aux onglets.</p>
+
+<p>Si vous définissez une nouvelle icône en utilisant <code>setIcon()</code>, et omettez l'option <code>tabId</code> and <code>windowId</code>, cela définit <em>"icône globale"</em>. L'icône globale apparaîtra alors dans tous les onglets qui n'ont pas de jeu d'icônes spécifiques aux onglets et dont la fenêtre n'a pas d'icône spécifique à la fenêtre.</p>
+
+<h2 id="Syntaxe">Syntaxe</h2>
+
+<pre class="syntaxbox brush:js">var settingIcon = browser.sidebarAction.setIcon(
+ details // object
+)
+</pre>
+
+<h3 id="Paramètres">Paramètres</h3>
+
+<dl>
+ <dt><code>details</code></dt>
+ <dd><code>object</code>. Un Objet contenant des propriétés <code>imageData</code> ou <code>path</code>, et éventuellement une propriété <code>tabId</code>.</dd>
+ <dd>
+ <dl class="reference-values">
+ <dt><code>imageData</code>{{optional_inline}}</dt>
+ <dd>
+ <p><code>{{WebExtAPIRef('sidebarAction.ImageDataType')}}</code> ou <code><code>object</code></code>. C'est un objet <code>ImageData</code> unique ou un objet dictionnaire.</p>
+
+ <p>Utilisez un objet dictionnaire pour spécifier plusieurs objets <code>ImageData</code> dans différentes tailles, de sorte que l'icône ne doit pas être mise à l'échelle pour un périphérique avec une densité de pixels différente. Si <code>imageData</code> est un dictionnaire, la valeur de chaque propriété est un objet <code>ImageData</code>, et son nom est sa taille, comme ceci :</p>
+
+ <pre class="brush: json line-numbers language-json"><code class="language-json"><span class="punctuation token">{</span>
+ <span class="key token">16:</span> <span class="string token">image16</span><span class="punctuation token">,</span>
+ <span class="key token">32:</span> image32
+<span class="punctuation token">}</span></code></pre>
+
+ <p>Le navigateur choisira l'image à utiliser en fonction de la densité de pixels de l'écran. Voir <a href="/fr/Add-ons/WebExtensions/manifest.json/browser_action#Choosing_icon_sizes">Choisir les tailles d'icônes</a> pour plus d'informations à ce sujet.</p>
+ </dd>
+ <dt><code>path</code>{{optional_inline}}</dt>
+ <dd>
+ <p><code><code>string</code></code> ou <code><code>object</code></code>. C'est soit un chemin relatif vers un fichier d'icône, soit un objet dictionnaire. </p>
+
+ <p>Utilisez un objet de dictionnaire pour spécifier plusieurs fichiers d'icônes de différentes tailles, de sorte que l'icône ne doit pas être mise à l'échelle pour un périphérique avec une densité de pixels différente. Si <code>path</code> est un dictionnaire, la valeur de chaque propriété est un chemin relatif, et son nom est sa taille, comme ceci :</p>
+
+ <pre class="brush: json line-numbers language-json"><code class="language-json"><span class="punctuation token">{</span>
+ <span class="key token">16:</span> "path/to/image16.jpg<span class="punctuation token">",</span>
+ <span class="key token">32:</span> "path/to/image32.jpg<span class="punctuation token">"</span>
+<span class="punctuation token">}</span></code></pre>
+
+ <p>Le navigateur choisira l'image à utiliser en fonction de la densité de pixels de l'écran. Voir <a href="/fr/Add-ons/WebExtensions/manifest.json/browser_action#Choosing_icon_sizes">Choosir les tailles d'icônes</a> pour plus d'informations à ce sujet.</p>
+
+ <p>si <code>path</code> est une chaîne vide, le navigateur utilisera l'icône par défaut.</p>
+
+ <p>si <code>path</code> n'est pas vide mais ne pointe pas vers un fichier d'icône, l'icône est masquée.</p>
+
+ <p>si <code>path</code> est <code>null</code>, et <code>tabId</code>a été spécifié, et que l'onglet spécifié possède un jeu d'icônes spécifique à l'onglet: l'icône spécifique à l'onglet est réinitialisée à l'icône globale (si une icône globale est définie) ou à l'icône manifeste.</p>
+
+ <p>si <code>path</code> est <code>null</code>, et <code>tabId</code> a été omis, et qu'il y avait un jeu d'icônes global, il sera réinitialisé à l'icône de manifest.</p>
+ </dd>
+ <dt><code>tabId</code>{{optional_inline}}</dt>
+ <dd><code>integer</code>. Définit l'icône uniquement pour l'onglet donné.</dd>
+ <dt><code>windowId</code> {{optional_inline}}</dt>
+ <dd><code>integer</code>. Définit l'icône uniquement pour la fenêtre donnée.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<ul>
+ <li>Si <code>windowId</code>et <code>tabId</code> sont tous deux spécifiés, la fonction échoue et l'icône n'est pas définie.</li>
+ <li>SI <code>windowId</code> et <code>tabId</code> sont tous deux omis, l'icône est définie globalement.</li>
+</ul>
+
+<h3 id="Valeur_retournée">Valeur retournée</h3>
+
+<p>Une <code><a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Promise">Promise</a></code> qui sera remplie sans argument une fois l'icône définie.</p>
+
+<h2 id="Compatibilité_du_navigateur">Compatibilité du navigateur</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("webextensions.api.sidebarAction.setIcon",2)}}</p>
+
+<h2 id="Exemples">Exemples</h2>
+
+<p>Le code ci-dessous bascule l'icône de la barre latérale de l'onglet actif lorsque l'utilisateur clique sur une action du navigateur :</p>
+
+<pre class="brush: js">var 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);</pre>
+
+<p>{{WebExtExamples}}</p>
+
+<div class="note"><strong>Remerciements :</strong>
+
+<p>Cette API est basée sur l'API Opera <a href="https://dev.opera.com/extensions/sidebar-action-api/"><code>chrome.sidebarAction</code></a>.</p>
+</div>