1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
|
---
title: ключ icons
slug: Mozilla/Add-ons/WebExtensions/manifest.json/icons
tags:
- Icons
- WebExtensions
- Веб-расширение
- Дополнения
- Расширения
translation_of: Mozilla/Add-ons/WebExtensions/manifest.json/icons
---
<div>{{AddonSidebar}}</div>
<table class="fullwidth-table standard-table">
<tbody>
<tr>
<th scope="row" style="width: 30%;">Тип</th>
<td><code>Object</code></td>
</tr>
<tr>
<th scope="row">Обязательный</th>
<td>Нет</td>
</tr>
<tr>
<th scope="row">Пример</th>
<td>
<pre class="brush: json">
"icons": {
"48": "icon.png",
"96": "icon@2x.png"
}</pre>
</td>
</tr>
</tbody>
</table>
<p>Ключ <code>icons</code> определяет, какие иконки (значки) будет использовать ваше дополнение. Эти иконки будут использоваться при показе вашего дополнения в менеджерах компонентов, таких как Менеджер Дополнений.</p>
<p>Он содержит информацию вида ключ-значение со следующими данными: размер изображения в пикселях и путь к соответствующему изображению относительно директории, в которой содержится дополнение.</p>
<p>Если иконки не предоставлены с помощью этого ключа <code>icons</code>, вместо них будет использоваться стандартная иконка для расширений.</p>
<p>Вы должны указать по крайней мере одну главную иконку, в идеале размером 48х48 пикселей. Эта иконка будет использоваться по умолчанию в Менеджере Дополнений. Конечно, можно добавить иконки любого размера, и Firefox постарается найти лучшую из них для показа в разных компонентах.</p>
<p>Firefox учитывает разрешение экрана, когда выбирает иконку. Чтобы получить наилучший результат на мониторах с большим разрешением, использующих технологию Retina display, добавьте для каждой иконки версию с размерами в два раза больше.</p>
<h2 id="Пример">Пример</h2>
<p>Ключи в объекте icons определяют размеры иконок в пикселях, значения - относительный путь к файлам с изображениями. Этот пример содержит иконку размером 48х48 пикселей и увеличенную версию для мониторов высокого разрешения.</p>
<pre class="brush: json">"icons": {
"48": "icon.png",
"96": "icon@2x.png"
}</pre>
<h2 id="SVG">SVG</h2>
<p>В качестве иконки можно использовать файл SVG. Тогда браузер будет масштабировать иконку так, чтобы она подходила к компоненту, в котором она используется. Но есть два предостережения:</p>
<ol>
<li>В файле изображения должен быть определён viewBox. Например:
<pre class="brush: html"><svg viewBox="0 0 48 48" width="48" height="48" ...</pre>
</li>
<li>Даже в том случае, если используется всего один файл, нужно определить его для разных размеров иконки в манифесте. Например:
<pre class="brush: json">"icons": {
"48": "icon.svg",
"96": "icon.svg"
}</pre>
</li>
</ol>
<div class="note">
<p>Если вы используете программу Inkscape или подобную ей для создания SVG, сохраняйте изображение как "Простой SVG". Иначе Firefox может запутаться во множестве специальных пространств имён и не отобразить картинку.</p>
</div>
<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>
<p>{{Compat}}</p>
|
