| Россия, Звенигород |
Инспектор
Вы можете этот курс.
Опубликован: 10.12.2007 | Уровень: специалист | Доступ: платный
Лекция 15:
XBL-связки
15.2. Конструирование связки XBL
Этот раздел описывает конкретные теги и атрибуты XBL.
Некоторые теги XBL имеют имена, совпадающие с именами, используемыми в Mozilla где-нибудь еще. При проектировании связки всегда неплохо указать полную ссылку на соответствующее пространство имен, чтобы избежать двусмысленности. Вот имена тегов XBL, используемые в другом значении:
<bindings> <body> <children> <content> <image>
Имена атрибутов, используемых в ином значении:
method action command modifiers charcode keycode key name readonly text
15.2.1. Граничные теги и -moz-binding
Большинство тегов XUL и HTML могут быть граничными в XBL. Чтобы тег мог быть граничным, он должен иметь фрейм - прямоугольную оформляемую стилями зону, в которой он высвечивается.
Тег со следующим атрибутом не имеет фрейма и не может быть граничным.
{ display: none; }Тег, получающий этот атрибут, потеряет те связки, которые имел. Поэтому граничный тег XUL должен иметь атрибут collapsed, а не hidden, если нужно его спрятать.
Связываются в связки конкретные теги, а не имена тегов. Каждое стилевое правило, содержащее -moz-binding, связывает набор конкретных тегов. В листинге 15.3 приведен ряд примеров.
box { -moz-binding: url("binding.xml#sample"); }
#id { -moz-binding: url("binding.xml#sample"); }
.class { -moz-binding: url("binding.xml#sample"); }
box[X="here"] { -moz-binding: url("binding.xml#sample"); }
box,vbox,hbox { -moz-binding: url("binding.xml#sample"); }
box vbox { -moz-binding: url("binding.xml#sample"); }
Листинг
15.3.
Примеры селекторов CSS2 для связок.
Первая строка кода присоединит каждый конкретный тег <box> к одной и той же связке. Каждый конкретный тег имеет собственный интерфейс и свое множество состояний. Вторая строка присоединит лишь один тег, независимо от его имени. Третья строка присоединит любой тег с данным атрибутом class. Четверная строка – подмножество тегов <box>, имеющих атрибут X="here". Пятая строка – теги <box>, <vbox>, <hbox> и т.д. Если два правила присоединяют один и тот же конкретный тег (а это очень неудачный вариант), используется более конкретное правило, либо более позднее правило, если селекторы одинаковы. То есть обычные правила выполнения инструкций CSS2.
Такая обработка стилевых правил используется в XUL для тегов, имеющих различные варианты, наподобие тега <button>. Каждый вариант использует различные связки. Их можно посмотреть в файле xul.css архива toolkit.jar в chrome.
Можно явно указать отсутствие связок:
{ -moz-binding : none; }Mozilla (по крайней мере, до версии 1.4) требует специальных приемов для добавления и уничтожения связок; следуйте советам, данным в разделе "Скриптинг", а не применяйте стилевые правила "в лоб".
Наконец, заметим, что есть одна давно известная ошибка (по крайней мере до версии 1.4). Тег со следующим стилем не будет работать корректно:
{ display: block; }Потому что block не является частью XUL, это ловушка, используемая в HTML. Избегайте комбинировать этот стиль с -moz-binding.
15.2.2. Тег <bindings>
Тег <bindings> является верхним тегом в документе XBL. У него нет специального значения и специальных атрибутов. Он может содержать только теги <binding>.
Декларация <!DOCTYPE> не обязательна для документов XBL. Если такая декларация есть, необходимым минимумом является следующее:
<!DOCTYPE bindings>
15.2.3. Тег <binding>
Тег <binding> содержит описание одной XBL-связки. Он может иметь до четырех вложенных тегов. Каждый из следующих тегов может появиться максимум один раз:
<resources> <content> <implementation> <handlers>
Все четыре тега опциональны. Рекомендуется, чтобы они были описаны именно в данном порядке, но это не обязательно. Тег <binding> без контента бесполезен, за исключением того случая, когда он убирает весь контент и все действия по умолчанию из граничного тега. Эффект подобен действию стиля "-moz-binding : none".
Тег <binding> имеет следующие специальные атрибуты:
id display extends inheritstyle
Атрибут id идентифицирует связку. Связка не имеет имени, а только идентифицирующий ее URL. Если часть #id в этом URL отсутствует, будет использован атрибут id первой связки в документе XBL.
Атрибут extends - это механизм наследования в XBL. Его можно установить в URL следующей связки. Последовательность связок, определяемых атрибутом extends, формирует цепочку наследования; это обсуждалось в разделе "Объектные свойства связок".
Атрибут extends может иметь сокращенное значение. Его можно использовать также для атрибута display. Оно состоит из префикса xul: и имени тега XUL. Оно утверждает, что связка основывается на существующем теге и должна использовать его свойства. В случае атрибута extends, этот тег дает базовую реализацию связки. Пример:
extends="xul:box"
Атрибут display может иметь только сокращенное значение, используемое для атрибута extends. Оно указывает, какой объект box применяется в данной связке. Указанный объект box - один из тех, которые обычно используются указанным тегом XUL. Пример:
display="xul:button"
Эта запись означает, что связка приобретет объект box, который имеет XUL тег <button>.
Атрибут inheritstyle может иметь значение false. Его значение по умолчанию true. Если его установить в false, граничный тег не приобретет тех стилей, с помощью которых оформлялся до того, как к нему была присоединена связка.
15.2.4. Тег <resources>
В теге <resources> указывается, какие еще документы требуются данной связке. Он подобен HTML тегу <LINK>. Тег <resources> не имеет специальных атрибутов и может содержать только следующие теги:
<image> <stylesheet>
Можно указать ноль или более этих тегов. Последовательность не имеет значения, за исключением того, что более поздние теги <stylesheet> будут применены после более ранних. Система XBL обходится не слишком интеллектуально с содержанием тега <resources>, как описывается далее.
15.2.4.1. Тег <image>
Тег <image> идентичен одноименному XUL-тегу, кроме того, что здесь единственным используемым атрибутом является src. Так же, как в XUL, src определяет URL изображения. <image src="icons.gif"/>
XBL ничего не делает с этим тегом, лишь предписывает платформе Mozilla получить это изображение и кэширует его. Это подсказка платформе, что данное изображение важно и может понадобиться позже. Оно может понадобиться в XUL теге <image>, HTML теге <img>, CSS2 свойстве liststyle-image, или в контентной части XBL-определения. Указание этого тега - лишь оптимизация выполнения.
15.2.4.2. Тег <stylesheet>
Тег <stylesheet> идентичен HTML тегу <style src=>. Он не может иметь иного собственного контента.
<stylesheet src="chrome://global/skin/button.css"/>
Стилевые таблицы используются в XBL, чтобы хранить все детали визуализации виджета. Это позволяет виджетам быть зависящими от темы. Это также дает возможность сконструировать стилевые правила так, чтобы они применялись лишь к анонимному контенту граничного тега. В предыдущем примере все визуальные детали тега <button> (основанного на XBL связке с id="button" ) сохранялись по зависящему от темы URL.
Можно использовать более одного тега <stylesheet> на связку, но это делается редко. Если такое случается, стили прикладываются в порядке их появления.
Если связка имеет цепочку наследования других связок, и они также имеют теги <stylesheet>, все стилевые таблицы будут использованы. Они прикладываются в порядке от конца цепочки к ее началу, так что первичная стилевая таблица имеет преимущество.
Все стандартные связки тегов, хранимые в toolkit.jar в директории chrome, имеют стилевые таблицы. Они зависят от темы. Дизайнер темы должен разработать все эти стандартные стилевые таблицы для данной темы, иначе визуальное отображение тегов XUL не будет единым в данной теме. То же относится к темам, оформляющим приложения Mozilla, такие как почтовый клиент. Стилевые таблицы XBL связок тегов, используемых в почтовом Клиенте, должны быть разработаны дизайнером, чтобы новая тема была применима в данном приложении.
Konstantin Grishko
| Россия, Москва, Московский финансово-промышленный университет "Синергия", Москва |