Первые элементы управления и темы

4.3.3.3. Тег <resizer>

Тег <resizer> используется для изменения размеров текущего окна. Пользователь может щелкнуть по содержимому тега <resizer> и перетаскивать его, увеличивая или уменьшая размеры соответствующего окна. Изменяется целое окно, независимо от того, где находится содержимое тега <resizer>. Если поместить <resizer> среди другого содержимого окна, он никак не повлияет на размещение элементов.

Существует два способа менять размеры окна приложения, и только в одном из них используется <resizer>.

Один способ изменить размеры окна - отправить окну сообщения от менеджера окон графической среды. Это делается при перетаскивании мышью графических элементов вокруг окна. Так отправляется инструкция менеджеру окон, а не приложению. Менеджер окон может самостоятельно изменить границы окна, не сообщая ничего приложению. Известный пример - менеджер окон twm для X11, у которого есть параметр "каркас" ( wire frame ). Когда пользователь хочет изменить окно с помощью графических элементов менеджера окон twm, содержимое окна приложения застывает, а на экране появляется каркас окна (несколько прямоугольников). Пользователь перемещает и растягивает этот каркас так, как ему нужно, а затем отпускает кнопку мыши. Приложение получает сообщение о том, что ему нужно изменить размеры окна, чтобы они соответствовали измененному каркасу; содержимое окна также размещается так, чтобы заполнить окно с новыми размерами. В этом случае приложению нужно заново рассчитывать размещение только один раз. Более сложные менеджеры окон, например Sawfish для GNOME, могут заставлять приложение менять размеры окна несколько раз, пока пользователь не отпустит кнопку мыши. В любом случае это способ изменения размеров окна извне, когда приложение получает инструкции "снаружи".

Во втором способе используется тег <resizer>. В этом случае приложение получает необработанные события мыши от графической среды, а не специальные инструкции для изменения окна. Приложение (Mozilla) само "догадывается" о том, что данные движения мыши подразумевают изменение размеров окна. Приложение напрямую или косвенно сообщает менеджеру окон об изменении размеров своего окна. У приложения по- прежнему есть выбор между изменением размещения содержимого несколько раз во время уменьшения или увеличения окна или один раз, когда будет известен окончательный размер. При использовании описанного способа изменение размеров окна инициируется приложением, а не менеджером окон. Если менеджер окон отсутствует, как, например, в случае маленькой встроенной системы вроде телеприставки или карманного компьютера, то это единственный способ изменить размеры окна.

Тег <resizer> приводит к непрерывному, а не однократному пересчету размещения содержимого. Размещение видимого содержимого обновляется настолько быстро, насколько это возможно при уменьшении или увеличении окна.

Как <resizer> влияет на границы окна, зависит от значения его особого атрибута dir. Использование dir совместно с <resizer> отличается от использования dir как обычного базового атрибута блочного размещения. В случае <resizer> этот атрибут определяет направление, в котором окно будет расширяться или сужаться, и может принимать одно из следующих значений:

top left right bottom topleft topright bottomleft bottomright

Значение по умолчанию - topleft. Первые четыре значения позволяют окну менять размер только в одном направлении, при этом противоположный край окна фиксируется. Оставшиеся четыре значения позволяют перемещать угол окна диагонально по направлению от противоположного угла (или к нему), который также фиксируется. Поверхностный просмотр исходных текстов Mozilla открывает существование атрибутов direction и resizedirection. Они работают не как dir и не делают ничего особенно важного, они просто хранят данные.

У тега <resizer> нет содержимого и внешнего вида по умолчанию. Если он должен быть видимым, для него нужно указать конкретные стили и содержимое. В Mozilla вплоть до версии 1.2.1 стили и содержимое по умолчанию для <resizer> отсутствуют, так что его нельзя использовать без простейшей предварительной подготовки. В более поздних версиях он появляется в правом нижнем углу окна.

4.3.3.4. Тег <gripper>

Тег <gripper> - единственное содержимое <thumb>, которое, в свою очередь, должно быть содержимым <scrollbar>. Это пользовательский тег без содержимого, атрибутов и особого значения, и в его использовании как самостоятельного тега нет никакой нужды. Его имя "gripper" - всего лишь жаргонный синоним слова "grippy".

4.3.4. Метки и <label>

Как описывалось в "Статическое содержимое" , "Статическое содержимое", тег <label> позволяет добавлять обычное текстовое содержимое, но он нужен не только для этого. <label> также предоставляет содержимое другим тегам, помогает пользователю при вводе и предоставляет информацию, необходимую для людей с ограниченными возможностями. Аспекты навигации и accessibility обсуждаются в "Формы и меню" , "Формы и меню". Здесь мы будем смотреть на <label> как на вспомогательный элемент кнопок.

У <label> есть две полезные особенности. Они могут предоставлять кнопкам содержимое и самостоятельно действовать как кнопка. Предоставление содержимого происходит так же, как и с любыми другими содержательными тегами. Вот простейший пример:

<button><label>Press Me</label></button>

Есть и альтернативная запись этого примера. Многие XUL-теги поддерживают атрибут labe l. В случае кнопки этот атрибут задает содержимое видимой кнопки. Перепишем предыдущий пример с использованием данного атрибута:

<button label="Press Me"/>

Разница между атрибутами label и value неочевидна. На данном этапе достаточно сказать, что визуально они выглядят одинаково, но у label есть некоторые особенности. Одна из них - возможность имитировать кнопку.

Если label используется вместе с тегами <checkbox> или <radio> (которые обсуждаются в "События" , "События"), тогда текст метки появляется рядом с элементом управления тега и может быть нажат, как если бы он был кнопкой. В некоторых графических средах пользователю дается подсказка при наведении на метку указателя мыши или если кнопка получает фокус, но иначе текст никак не выделяется. Так пользователю легче работать с элементом управления: он может щелкнуть как по самому элементу, так и по соответствующему тексту.

Освоить работу с label сложно, потому что у него много разных вариантов использования, он применим не ко всем тегам. Он может предоставлять содержимое многим тегам, но <checkbox> и <radio> - единственные практические примеры использования текста <label> как кнопки.

4.3.5. Остатки

XUL-часть Mozilla достаточно нова, и на подготовку версии 1.0 потребовалось время. В ней все еще есть пробелы и уязвимые места. Есть еще несколько других тегов кнопок, едва упоминавшихся при обсуждении XUL. Эти теги могут быть причиной бесконечной путаницы, если не знать, что они собой представляют, не говоря уже о том, сколько придется играть в детектива, чтобы определить их текущий статус. Несколько наиболее непонятных тегов перечислены ниже.

• <menubutton>, не аналог <button type="menu-button">. Это заброшенный эксперимент комбинирования кнопок и меню. Лучше забыть о нем и вместо него использовать атрибут type.
• <titledbutton> был ранней попыткой комбинирования изображений и текста в кнопке, пока обычный <button> не достиг своего текущего состояния. Забудьте о нем и пользуйтесь <button>.
• <spinner> - попытка создать элемент управления, который иногда называется счетчиком. Такой элемент управления состоит из поля с текстом и двумя маленькими кнопками с одной стороны. Эти кнопки находятся друг поверх друга, одна - стрелка вверх, другая - вниз. С их помощью пользователь может прокручивать последовательности значений, появляющиеся в текстовом поле при каждом нажатии. Пользователь может как ввести желаемое значение вручную, так и дойти до него с помощью кнопок. <spinner> еще не закончен и не готов к работе.
• <spinbuttons> - дальнейшая попытка развития счетчиков, но состоит только из пары кнопок без текстового поля. У нее есть полное XBL-определение, но информация о стилях, в том числе об изображениях, отсутствует, как и в <resizer>. В лучшем случае это отправная точка для создания полнофункционального тега счетчика.
• <slider> - последний тег, который вносит свой вклад в создание полос прокруток. Это полоса, на которой можно щелкать мышью и по которой перемещается ползунок <thumb>. <slider> тесно связан с тегом <scrollbar> и может привести к аварийному завершению работы классического браузера, если использовать его отдельно. Любыми способами избегайте встречи с ним.

Этот список завершает возможности независимых кнопок в XUL Mozilla.

Многие более сложные XUL-теги Mozilla также содержат элементы, похожие на кнопки. В таких случаях бессмысленно пытаться отдельно рассматривать эти кнопки. Теги вроде <tabbox>, <listbox> и <tree> подробно рассматриваются в разделах, посвященных им.

Кроме всего прочего, кнопки - прекрасный повод подумать о проблемах интеграции с графической средой. Будет ли ваше приложение Mozilla органично сочетаться с другими приложениями, которые пользователь запускает на своем компьютере? Прежде всего, ваши кнопки должны соответствовать кнопкам этих приложений. Как этого добиться, показано ниже.