Go!Verla Flex Blog

На моей последней работе в голландской компании KZOO webcreatie я разрабатывал AIR приложение для визуального построения шаблонов к некоему серверному движку, которым владеет компания. Приложение предоставляет пользователям набор элементов (список, елемент, контент) для построения гибкой древовидной структуры. Результатом работы есть XML файл, в котором содержится как некоторая скриптовая логика, так и структура БД, а так же и HTML представление. Серверный движок на основе этого файла реализует связь с БД и генерирует конечную HTML страницу. Система довольно универсальная, но, конечно же, не может покрыть узкопрофильные решения, только типовые сайты.

Программа доступна для ознакомительной установки. Наврядли удастся как-то использовать на практике, без соответствующего ПО для серверной стороны.

Некоторые детали

Интерфейс программы выполнен без дополнительного «скинования». Я не использовал никаких фреймворков. Поддерживается undo/redo для всех операций. Из интересных архитектурных моментов могу описать процесс декларации метаданных для передачи информации в редактор свойств выбранного элемента в дереве.

По-сути, каждый элемент дерева это наследник базового класса TreeNode, в котором объявлены специфические для его типа свойста, например:

public class PagesBaseNode extends TreeNode {

        [Bindable]
        [Serializable]
        [Editable(group="General", dependentGroup="Page", editor="CheckBoxEditor",
            label="page", bindable="true", index="5")]
        public function get page() : Boolean {
            return _page;
        }

        public function set page(value : Boolean) : void {
            _page = value;
        }

        [Serializable]
        [Editable(group="Page", editor="StringEditor", label="start template:", index="0")]
        public function get startTemplate() : String {
            return _startTemplate;
        }

        public function set startTemplate(value : String) : void {
            _startTemplate = value;
        }

        [Serializable]
        [Editable(group="Page", editor="CollectionEditor", label="aliases:",
            itemsEditor="TwoStringsEditor", itemsClass="PageAliasEntry",
            itemField1="alias", itemField2="target", index="1")]
        public function get pageAliases() : ArrayCollection {
            if (_pageAliases == null) {
                _pageAliases = new ArrayCollection();
            }
            return _pageAliases;
        }

        private var _page : Boolean;

        private var _startTemplate : String;

        private var _pageAliases : ArrayCollection;
    }

С помощью метаданных Serializable я указываю какое значение нужно сохранять в результирующем XML, блок Editable описывает тип редактора, подпись, позицию в наборе, а также, если свойство имеет списочный тип — класс элементов списка и названия полей в которые будут сохранятся значения.

Данное решение очень удобно тем, что при наличии более 10 типов элементов дерева в среднем с 5 уникальными свойствами в каждом из них, я избегаю разработки массы различных форм с разными наборами идентичных контролов для редактирования. При каждом выборе элемента дерева, редактор свойств, используя Repeater, генерирует набор из стандартных, предварительно запрограммированных редакторов: StringEditor, CheckboxEditor, CollectionEditor, TwoStringsEditor etc.

Cчитывание метаданных из объекта — дело техники, это не сложно.

Я подумывал о том, что-бы вычленить базовые классы TreeEditor, TreeArrow и TreeNode как отдельную open source библиотеку. А так же, можно добавить код по обработке метаданных элементов дерева и редактора свойств туда же. Если в коментариях отпишется хотя-бы один человек, кому бы это пригодилось — я это сделаю.

На разработку, в общей сложности и в одиночку, я потратил 6 месяцев. Первые четыре на программирование, вторые два на исправление ошибок. Заказчик очень доволен и не хочет останавливаться на достигнутом. Я, правда, не уверен буду ли я учавствовать в этом продолжении.