Опубликован: 10.12.2007 | Доступ: свободный | Студентов: 822 / 20 | Оценка: 5.00 / 5.00 | Длительность: 58:33:00
Лекция 13:

Списки и Деревья

13.2.11 Взаимодействие с пользователем

Списки предоставляют пользователю больше возможностей для взаимодействия, нежели обычные формы. Они, как минимум, столь же гибкие, как меню.

Списки поддерживают и ввод с клавиатуры, и управление мышью, и имеют специальные функции для людей с ограниченными возможностями. Навигационные клавиши включают Tab, Arrow, Paging, Home, End и пробел. Поддержка мыши включает клики и комбинации клавиша-клик, и поддержку колесика мыши. Чтобы получить доступ к специальным возможностям, определите содержимое тега <listitem> как атрибут label или тег <label>.

Списки являются членами фокусного кольца текущей страницы. Если тег <listbox> не имеет выбранной строки, то, когда он получает фокус как очередной член фокусного кольца, его внешний вид не изменится, хотя он получит фокус.

Выбор же строки - это тонкая материя. Если возможен выбор единственной строки, то выбор устроен так же, как в меню. Если же атрибут seltype имеет значение multiple, может быть выбрано несколько строк одновременно. Мышью можно выбрать непрерывный ряд строк, с помощью, как обычно, shift-клик, или произвольное подмножество строк, с помощью ctrl-клик. Непрерывное подмножество срок можно выбрать и с клавиатуры, с помощью комбинаций shift-стрелка. С клавиатуры нельзя выбрать произвольное подмножество строк. Только мышь способна сделать это.

Одна строка списка может быть выбрана с клавиатуры с помощью нажатия клавиши символа. Список должен в этот момент иметь фокус. Нажатый символ сравнивается с атрибутом label тега <listitem> в теге <listbox>. Если первый символ атрибута label совпадает с нажатым символом, они соответствуют друг другу. Система отмечает данную строку как выбранную. Тег <listitems> считается замкнутым кольцом, подобно кольцу фокуса. Начальная точка кольца - текущий выбранный <listitem>, если он есть, в противном случае - первый <listitem> в списке. Список сканируется до тех пор, пока не найдется подходящая символу строка. Это позволяет пользователю циклично сканировать список несколько раз.

Пользователь не может изменять размеры колонок многоколоночного списка, если только программист не усовершенствует тег "список" с помощью дополнительных обработчиков событий. То же самое верно и для скрытия и схлопывания колонок.

13.2.12 Интерфейсы AOM и XPCOM

Тег <listbox> можно использовать не только для того, чтобы представить данные, но чтобы управлять этими данными. Необходимость вводить, исправлять, уничтожать данные, получить или сохранить их означает, что спискам требуется и надежный программный интерфейс.

XBL-определение тега <listbox> дает целый ряд свойств и методов, доступных на JavaScript. Многие из этих свойств имитируют действие стандартов DOM 0 и DOM 1. Они описаны в Таблице 13.2. Данная таблица соответствует версии 1.4 XBL-определения списка.

Таблица 13.2. Свойства и методы DOM-объекта тега <listbox>
Свойство или метод Описание
Accessible интерфейс доступности XPCOM
listBoxObject Специальный boxObject
disableKeyNavigation Включить (true) или выключить ввод с клавиатуры (null)
timedSelect(listitem, millisec delay) Выбрать данный <listitem> с задержкой, позволяющей прокручивать список с необходимой пользователю скоростью
selType То же, что и атрибут seltype
selectedIndex Получить или установить индекс текущего выбранного элемента, начиная с 0. Если выбрано несколько строк, возвращает -1
Value Текущее значение выбранного элемента, или ложь, если выбрано более одного элемента
currentItem Последний выбранный <listitem>
selectedCount Число выбранных <listitem>
appendItem(label, value) Добавить <listitem> в конец <listbox>
insertItemAt(index, label, value) Добавить <listitem> в определенной позиции
removeItemAt(index) Удалить строку в определенной позиции
timedSelect(listitem, millisec delay) Выбрать данный <listitem> с задержкой, позволяющей прокручивать список
addItemToSelection(listitem) Добавить данный DOM <listitem> в необходимую позицию (и выбрать)
removeItemFromSelection(listitem) Снять отметку "выбрано" с данного DOM <listitem>
toggleItemSelection(listitem) Изменить состояние элемента "выбрано" на обратное
selectItem(listitem) Снять отметку "выбрано" везде и затем выбрать данный элемент
selectItemRange(startItem, endItem) Снять отметку "выбрано" везде и затем выбрать последовательность элементов
selectAll() Выбрать все элементы списка, кроме заголовков
invertSelection() Изменить порядок выбранных элементов на обратный
clearSelection() Снять отметку "выбрано" со всех элементов
getNextItem(listitem, offset) Вернуть элемент списка через offset от указанного
getPreviousItem(listitem,offset) Вернуть элемент списка до offset от указанного
getIndexOfItem(listitem) Найти порядковый номер элемента
getItemAtIndex(index) Возвратить элемент с номером index
ensureIndexIsVisible(index) Пролистать список, чтобы элемент был виден
ensureElementIsVisible(listitem) Пролистать список, чтобы элемент был виден
scrollToIndex(index) Пролистать список, чтобы элемент был виден
getNumberOfVisibleRows() Число видимых строк
getIndexOfFirstVisibleRow() Порядковый номер первой видимой строки
getRowCount() Число строк

Эти свойства и методы приведены здесь, потому что графические элементы управления тега <listbox> обычно можно изменять программным путем, а эти интерфейсы отличаются от тех, которые привычны нам по web-разработкам. Нужно использовать именно эти свойства и методы, а не интерфейсы DOM 1 Node и Element, в противном случае тег <listbox> может реагировать неадекватно. Таблица не содержит ничего нового, это тот же XBL в иной форме и комментарии к нему.

Важная особенность этого интерфейса - использование аргумента index. index относится ко всякому видимому элементу списка. Видимые элементы - это те прямоугольные блоки содержания списка, которые можно прокручивать для просмотра. index не соотносится ни с каким списком тегов во внутренней конструкции тега <listbox>. Для списков это различие вырождено, тривиально, поскольку каждый видимый прямоугольник содержания соотносится ровно с одним тегом <listitem>. Позже мы увидим, что подобный index в теге <tree> может не соответствовать ничему, хотя видимый блок содержания может присутствовать.

В лекциях "Формы и меню" , "Навигация" , и "Окна и панели" мы видели, что теги <menupopup>, <scrollbox>, и <iframe>, среди прочих, являются тегами специального, блокоподобного вида. Они примечательны тем, что поддерживают дополнительные возможности обработки их содержания. DOM-объекты этих тегов содержат свойство boxObjext, которое предоставляет особенный интерфейс. Этот особенный интерфейс и дает нам доступ к добавочным возможностям обработки контента.

Тег <listbox> - еще один пример такого рода блокообразных тегов. Он поддерживает интерфейс nsIListBoxObject. Этот интерфейс дает возможность произвольного доступа к содержанию списка. Этот доступ можно также реализовать с помощью компонента

@mozilla.org/layout/xul-boxobject-listbox;1

Одна из причин, почему Таблица 13.2 столь велика, заключается в том, что большинство (хотя и не все) свойства nsIListBoxObject были экспортированы в XBL-определение тега <listbox>. Они перечислены в последней трети Таблицы 13.2. В терминах объектно-ориентированного подхода, XBL-определение тега <listbox> является фасадом этого особенного интерфейса.

Фактически, большинство методов и свойств в Таблице 13.2 соответствуют опубликованному XPCOM интерфейсу. Интерфейс nsIDOMXULSelectControlElement также реализован с помощью меню, радио- групп и вкладок. И лишь nsIDOMXULMultiSelectControlElement реализован с помощью объектов, которые XBL создает специально для тега <listbox>.

На этом мы закончим обсуждение тега <listbox>. XUL-деревья, описываемые ниже, могут делать все то же, что и списки, и много больше.