XUL - изображение панели инструментов нет или неправильно - PullRequest
2 голосов
/ 05 декабря 2011

Я провел целый день на чем-то столь тривиальном, как этот, но до сих пор не могу сделать эту работу. Вместо моей иконки появляется огромное странное изображение. Если я уберу класс toolbarbutton-1, изображение вообще не появится. Вот все, что имеет значение: (Это будет очень длинный пост ...)

My XUL содержит только кнопку панели инструментов на панели инструментов:

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://ytweaks/skin/style.css" type="text/
css"?>
<overlay id="yTweaks" xmlns="http://www.mozilla.org/keymaster/
gatekeeper/there.is.only.xul">
    <script src="main.js" />
    <toolbarpalette id="BrowserToolbarPalette">
        <toolbarbutton id="ytweaks-main-button" class="toolbarbutton-1
chromeclass-toolbar-additional"
            type="menu"
            label="yTweaks"
            tooltiptext="yTweaks"
            state="enabled">
        </toolbarbutton>
    </toolbarpalette>
</overlay>

И CSS такой же, как в учебнике по MDN:

#ytweaks-main-button {
  list-style-image: url("chrome://ytweaks/skin/icon.large.png");
}

toolbar[iconsize="small"] #ytweaks-main-button {
  list-style-image: url("chrome://ytweaks/skin/icon.small.png");
}

Файл манифеста выглядит так:

content ytweaks chrome/content/
overlay chrome://browser/content/browser.xul chrome://ytweaks/content/ui.xul

skin ytweaks classic/1.0 skin/classic/ytweaks/
style chrome://global/content/customizeToolbar.xul chrome://ytweaks/skin/style.css

И структура папок:

chrome
|-- content
|   |-- ui.xul
|   |-- main.js
|-- skin
    |-- classic
        |-- ytweaks
            |-- icon.large.png
            |-- icon.small.png
            |-- style.css

И, наконец, результат выглядит так: enter image description here

Совершенно не тот значок, который я сделал. Это мой значок, который должен появиться ( большой): enter image description here


Кроме того, как я могу отлаживать эти вещи? Например, как я могу просмотреть Chrome Registry. Если я введу chrome URI в Firefox, ничего не произойдет За исключением основного файла XUL браузера, который загружает еще один полный браузер.

Ответы [ 2 ]

2 голосов
/ 06 декабря 2011

Это оказалось из-за неверного пути:

skin ytweaks classic/1.0 skin/classic/ytweaks/

.., который должен быть:

skin ytweaks classic/1.0 chrome/skin/classic/ytweaks/

Re: отладка.Я протестировал бы 3 вещи:

  • Используйте самые простые правила, которые, как вы знаете, должны совпадать, а затем проверьте стили на рассматриваемом элементе с помощью инспектора DOM, чтобы увидеть, соответствуют ли ваши правила.Если этого не произошло, ваша таблица стилей по какой-то причине не была применена.
  • Посмотрите внимательно на строку, которая применяет таблицу стилей (в вашем случае это строка style в вашем chrome.manifest).Я не знаю, как вы можете отлаживать здесь опечатки.
  • Убедитесь, что chrome: // URL-адрес таблицы стилей работает, когда вы открываете ее через строку адреса.Он должен отображать текст вашего файла CSS.
    • Если вы получили сообщение No chrome package registered for chrome://aaa/skin/aaa.css в консоли ошибок, ваше объявление skin в chrome.manifest не было обработано или имя «провайдера» (aaa в моем примере выше) не было обработаносоответствует названию «провайдера», указанному после «skin»
    • Если вы получаете страницу с ошибкой в ​​содержании, говорящую File not found. Firefox can't find the file at chrome://aaa/skin/bbb.css (как в вашем случае), это означает, что часть пути объявления skin неверна,Это должно быть относительно chrome.manifest (и iirc заканчивается на /)
0 голосов
/ 05 декабря 2011

Исходя из информации, которую вы предоставили выше, если это ваш путь ytweaks/skin/icon.small.png, но структура вашей папки

 |-- ytweaks
     |-- icon.large.png
     |-- icon.small.png
     |-- style.css

Тогда мне кажется, что вы либо пропускаете подпапку skin в ytweaks или у вас не должно быть этого в пути к изображению.

...