Использование компонента TileList

Взаимодействие пользователей с компонентом TileList
Параметры компонента TileList
Создание приложения с компонентом TileList
- Создание компонента TileList с помощью ActionScript

Компонент TileList содержит список, который состоит из строк и столбцов и заполняется данными, полученными от поставщика данных. Элементом называется единица данных, которая хранится в ячейке компонента TileList. Элемент, полученный от поставщика данных, как правило, имеет свойства label и source . Свойство label определяет содержимое для отображения в ячейке, а свойство source передает его значение.

Можно создать экземпляр Array самостоятельно или получить его с сервера. Компонент TileList имеет методы для доступа к поставщику данных, например addItem() и removeItem() . Если у списке нет внешнего поставщика данных, эти методы автоматически создают экземпляр DataProvider через свойство List.dataProvider .

Взаимодействие пользователей с компонентом TileList

Экземпляр TileList визуализирует каждую ячейку с использованием объекта Sprite, внедряющего интерфейс ICellRenderer. Указать этот визуализатор можно с помощью свойства cellRenderer экземпляра TileList. Для компонента TileList значением свойства CellRenderer по умолчанию является объект ImageCell, который отображает изображение (класс, растровое изображение, экземпляр или URL-адрес) и дополнительную метку. Метка представляет собой одну строку, выровненную по нижнему краю ячейки. Прокручивать экземпляр TileList можно только в одном направлении.

Когда экземпляр TileList получает фокус, для доступа к его элементам можно использовать следующие клавиши.

Клавиша	Описание
«Стрелка вверх» и «Стрелка вниз»	Позволяет перемещаться вверх и вниз по столбцу. Если свойство `allowMultipleSelection` имеет значение `true` , эти клавиши можно использовать в сочетании с клавишей Shift, чтобы выделить несколько ячеек.
»Стрелка влево» и «Стрелка вправо»	Позволяют перемещаться влево или вправо по строке. Если свойство `allowMultipleSelection` имеет значение `true` , эти клавиши можно использовать в сочетании с клавишей Shift, чтобы выделить несколько ячеек.
Домашняя страница	Выделяет первую ячейку в экземпляре TileList. Если свойство `allowMultipleSelection` имеет значение `true` , то удерживая клавишу Shift при нажатии Home, можно выделить все ячейки с текущей до первой.
End	Выделяет последнюю ячейку в экземпляре TileList. Если свойство `allowMultipleSelection` имеет значение `true` , то удерживая клавишу Shift при нажатии End, можно выделить все ячейки с текущей до последней.
Ctrl	Если свойство `allowMultipleSelection` имеет значение `true` , с помощью этой клавиши можно выбрать несколько непоследовательных ячеек.

Когда в приложение добавляется компонент TileList, его можно сделать доступным для программ чтения с экрана путем добавления следующих строк кода ActionScript.

import fl.accessibility.TileListAccImpl; 
 
TileListAccImpl.enableAccessibility();

Расширенный доступ для компонента включается только один раз, независимо от числа его экземпляров. Дополнительные сведения см. в главе 18 «Создание содержимого с расширенной доступностью» в руководстве Использование Flash .

Параметры компонента TileList

В Инспекторе свойств или Инспекторе компонентов можно задать следующие параметры разработки для каждого экземпляра компонента TileList: allowMultipleSelection , columnCount , columnWidth , dataProvider , direction , horizontalScrollLineSize , horizontalScrollPageSize , labels , rowCount , rowHeight , ScrollPolicy, verticalScrollLineSize, verticalScrollPageSize . Каждый из этих параметров имеет соответствующее свойство ActionScript с тем же именем. Сведения об использовании параметра dataProvider см. в разделе « Использование параметра dataProvider ».

Можно написать код ActionScript, чтобы задать дополнительные параметры для экземпляров TileList с использованием их методов, свойств и событий. Дополнительные сведения см. в описании класса TileList в справочнике ActionScript® 3.0 для Adobe® Flash® Professional CS5 .

Создание приложения с компонентом TileList

В этом примере используются объекты MovieClip для заполнения экземпляра TileList массивом цветов краски.

Создайте новый документ Flash (ActionScript 3.0).
Перетащите компонент TileList в рабочую область и присвойте ему имя экземпляра aTl .

Откройте панель «Действия», выберите «Кадр 1» на главной временной шкале и введите следующий код ActionScript.

import fl.data.DataProvider; 
import flash.display.DisplayObject; 
 
var aBoxes:Array = new Array(); 
var i:uint = 0; 
var colors:Array = new Array(0x00000, 0xFF0000, 0x0000CC, 0x00CC00, 0xFFFF00); 
var colorNames:Array = new Array("Midnight", "Cranberry", "Sky", "Forest", "July"); 
var dp:DataProvider = new DataProvider(); 
for(i=0; i < colors.length; i++) { 
    aBoxes[i] = new MovieClip(); 
    drawBox(aBoxes[i], colors[i]);    // draw box w next color in array 
    dp.addItem( {label:colorNames[i], source:aBoxes[i]} ); 
} 
aTl.dataProvider = dp; 
aTl.columnWidth = 110; 
aTl.rowHeight = 130; 
aTl.setSize(280,150); 
aTl.move(150, 150); 
aTl.setStyle("contentPadding", 5); 
 
function drawBox(box:MovieClip,color:uint):void { 
            box.graphics.beginFill(color, 1.0); 
            box.graphics.drawRect(0, 0, 100, 100); 
            box.graphics.endFill();         
}

Выберите «Управление» > «Тестировать ролик», чтобы проверить приложение.

Создание компонента TileList с помощью ActionScript

В этом примере выполняется создание экземпляра TileList и добавление в него экземпляров компонентов ColorPicker, ComboBox, NumericStepper и CheckBox. Создается экземпляр Array с именем dp , содержащий метки и имена компонентов для отображения, и присваивается в качестве значения свойству dataProvider экземпляра TileList. Макет экземпляра TileList создается с помощью свойств columnWidth и rowHeight и метода setSize() , затем он размещается в рабочей области с помощью метода move() . Стиль contentPadding используется для добавления пробела между границами и содержимым экземпляра TileList, а метод sortItemsOn() сортирует содержимое по меткам.

Создайте новый документ Flash (ActionScript 3.0).
Перетащите следующие компоненты с панели «Компоненты» на панель «Библиотека»: ColorPicker, ComboBox, NumericStepper, CheckBox и TileList.

Откройте панель «Действия», выберите «Кадр 1» на главной временной шкале и введите следующий код ActionScript.

import fl.controls.CheckBox; 
import fl.controls.ColorPicker; 
import fl.controls.ComboBox; 
import fl.controls.NumericStepper; 
import fl.controls.TileList; 
import fl.data.DataProvider; 
 
var aCp:ColorPicker = new ColorPicker(); 
var aCb:ComboBox = new ComboBox(); 
var aNs:NumericStepper = new NumericStepper(); 
var aCh:CheckBox = new CheckBox(); 
var aTl:TileList = new TileList(); 
 
var dp:Array = [ 
{label:"ColorPicker", source:aCp}, 
{label:"ComboBox", source:aCb}, 
{label:"NumericStepper", source:aNs}, 
{label:"CheckBox", source:aCh}, 
]; 
aTl.dataProvider = new DataProvider(dp); 
aTl.columnWidth = 110; 
aTl.rowHeight = 100; 
aTl.setSize(280,130); 
aTl.move(150, 150); 
aTl.setStyle("contentPadding", 5); 
aTl.sortItemsOn("label"); 
addChild(aTl);

Выберите «Управление» > «Тестировать ролик», чтобы проверить приложение.