Потребовалось отображать табличные данные на чистом as3 без использования компонентов Flex (типа DataGrid) или Flash. Как обычно, первым на очереди был гугл. Но, к своему удивлению, ничего бесплатно-приемлемого найти не удалось. Изваял свой. Старался сделать компонент максимально простым в использовании. Можно загрузить swc-файл и подключать к любому проекту. Версия Flash-плеера не меньше 10-й. Если у кого-то появится заинтересованность, то функционал можно разширить. Пока мне для своих нужд того что уже сработал вполне достаточно.
Можно потестить на примере ниже (другие компоненты GUI, кроме таблицы — замечательная библиотека Кита Питерса (Keith Peters) MinimalComps).
Компонент поддерживает следующие стили ячеек:
- width
- height
- padding
- spacing
- borderColor
- backgroundColor
- fontColor
- fontSize
- backgroundOpacity
- border
- bold
- wordWrap
- fontFamily
- aling
Стили можно независимо назначить на всю таблицу (DEFAULT_CELL_STYLE), на хедер (HEADER_ROW_STYLE), на четные/нечетные строки (EVEN_ROW_STYLE и ODD_ROW_STYLE) и на каждый столбец ("1", "2" ...)
Подключается к проекту инструкцией:
import ru.pixeltyumen.controls.SimpleTable;
Далее компонент во многом наследуют поведение класса Sprite. Т.е. примерно так:
var t:SimpleTable = new SimpleTable([
["1-1", "1-2", "1-3"],
["2-1", "2-2", "2-3"],
["3-1", "3-2", "3-3"]
]);
t.setHeader(["Колонка 1", "Колонка 2", "Колонка 3"]);
t.setStyle( { spacing:5, padding:5 }, SimpleTable.DEFAULT_CELL_STYLE);
t.setStyle({align: "center", bold: true, height: 52}, SimpleTable.HEADER_ROW_STYLE);
t.setStyle({align: "center", width: 100}, "1");
t.setStyle({align: "left", width: 300}, "2");
t.setStyle({align: "center", width: 100}, "3");
addChild(t);
Интерфейс компоненты SimpleTable:
- Статические переменные DEFAULT_CELL_STYLE, HEADER_ROW_STYLE, EVEN_ROW_STYLE и ODD_ROW_STYLE - маркеры стилей.
- Конструктор SimpleTable(array2d:Array = null, style:Object = null) принимает (можно не передавать, а назначить позже) двумерный массив данных (хедер таблицы определяется отдельно) и объект, формирующий стиль DEFAULT_CELL_STYLE (который, к слову, всегда можно переопределить).
- Метод setData(array2d:Array, style:Object = null):void несет такую же смысловую нагрузку как и конструктор за исключением того, что аргумент array2d должен передаваться в обязательном порядке.
- Метод setHeader(stringArray:Array, style:Object = null):void подобен методу setData, но определяет не двумерную сетку данных, а одномерный массив строк столбцов хедера таблицы, которую впрочем можно и не назначать.
- Метод setStyle(style:Object, type:String = DEFAULT_CELL_STYLE):void позволяет назначить кастомный стиль.
- Метод style(name:String):Params принимает имя стиля и возвращает объект стиля, если такой существует, иначе null.
- Метод draw(e:Event = null):void перерисовывает таблицу. Хотя таблица и перерисовывается автоматически при изменении стилей, но при изменении данных её перерисовку всё же нужно вызвать вручную.
- Свойство version — номер версии компоненты.
Свойства width и height класса SimpleTable блокированы. Ширина и высота рассчитывается из размеров ячеек таблицы.
Загрузить библиотеку компоненты можно здесь.
0 комментариев:
Отправить комментарий