Гибкий рабочий процесс и лучшие практики

Question

При рассмотрении учебных пособий и примеров проектов Flex они, как представляется, сосредоточены главным образом на элементах формы и сетках данных, а не на представлении контента более наглядным способом. Что мне и понадобится для этого предстоящего проекта. В результате у меня разрыв в уровне комфорта, и я надеюсь, что опытный разработчик Flex поможет мне справиться с трудностями.

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

1. верхняя левая панель будет содержать список категорий в вертикальной прокрутке.
2. В нижней левой панели будет отображаться эффект подкатегории колесика в зависимости от выбранной категории.
3. Верхняя правая панель будет содержать подробную информацию - Название и описание выбранной категории. А под ним название и описание выбранной подкатегории.
4. В нижней правой панели будет находиться список товаров и услуг, относящихся к данной подкатегории. Ниже каждого элемента в списке будет аккордеон группы ссылок со ссылками URL для получения дополнительной информации в каждом.

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

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

Хотя у меня есть куча вопросов, решение первого раздела кажется логичным, и первый вопрос, который приходит на ум в этом разделе, заключается в следующем: в верхней левой панели должен ли список категорий быть стандартными кнопками Flex, которые кожура? или они должны быть экземплярами объектов, как-то введенными во Flex. Затем во втором разделе я увидел компонент, который отображал изображения таким образом, который идеально подходил для этого раздела. Но элементы, показанные здесь, будут просто визуальными закругленными угловыми блоками с именами подкатегорий. Поэтому я не уверен, будет ли этот компонент работать или нет.

Answer 1

Спасибо за упоминание FlexSpaces . Обратите внимание, что он был окончательно перенесен в Flex 4, включая преобразование первого прохода в средства управления искрой в начале этого года. Еще предстоит сделать: добавить внедрение зависимостей с помощью Spring ActionScript, прекратить использование Cairngorm 2.x.

Answer 2

1. AS3 очень отличается от AS2. Я уверен, что вы уже заметили, но стоит упомянуть, если вы этого не сделали.

2. Компоненты Flex - это просто пакет Flash-объектов. Таким образом, вы можете, в некотором роде, написать каждый компонент Flex самостоятельно, используя только спрайты и / или TextFields. Это включает в себя скины. Скин - это всего лишь форма, прикрепленная к объекту с пользовательским рисунком.

3. Кнопка - это просто комбинация image + textField + skin, со всеми управляемыми событиями и переходами кожи.

Причина, по которой я упоминаю это, заключается в том, что нет правильного способа делать то, что вы хотите. Если вы используете элемент управления List, вам, вероятно, следует написать компонент, который реализует IListItemRenderer. Кнопка делает, так что вы можете просто переопределить кнопку, без проблем. Вы можете иметь кнопки с меткой + значок. Или просто значок. Или просто ярлык. Вы также можете определить, где метка расположена относительно значка (labelPosition = "выше | ниже | слева | справа"). Существует много встроенной гибкости.

Answer 3

Последние 6 месяцев я интенсивно занимался разработкой Flex 4 и должен сказать, что это облегчит вашу работу.

Вот что я бы сделал:

1) Проверьте FlexSpaces на лучшую архитектуру проекта Flex 3. Это полнофункциональная CMS во Flex с категориями, тегами, поиском, файловой системой, совместной работой и т. Д.

2) Загрузите Flex 4 SDK и установите его. Больше нет необходимости использовать Flex 3, если вы только начинаете, определенно перейдите к Flex 4. Если вам нужны пользовательские компоненты, Spark (новая архитектура компонентов) предлагает очень простой способ их выполнения (вот классная запись в блоге). создание Рейтингового компонента в Spark, который показывает вам, как это сделать). Flex 4 обратно совместим с компонентами Flex 3, поэтому вы можете использовать проекты / компоненты, которые вы найдете в Интернете, если хотите, без проблем.

3) Для верхнего левого списка категорий, если категории не являются вложенными, я бы использовал spark.components.List, ( вот один с использованием более сложных средств визуализации элементов). Затем просто расширьте spark.components.supportClasses.ItemRenderer, который действует как скин. Если категории вложены, просто используйте mx.controls.Tree. Проверьте, что FlexSpaces проект для этого (они показывают, как использовать XML / ArrayCollections в дереве, ваши вопросы "экземпляры объекта, приведенные в flex как-то").

4) Что касается эффекта колеса, то единственное, что мне не нравится в Spark, это то, что сложно анимировать макеты. Но люди начинают делать 3D-макеты, посмотрите Вот 5 3D-макетов для Flex 4 Райана Кэмпбелла. Также есть OpenFlux , если вы хотите очень легко анимированные макеты. Эффекты Flex в целом довольно неуклюжи, поэтому в итоге я использую Tweener или TweenMax для анимации.

5) Что касается перекомпоновки, попытка перекомпоновки с использованием архитектуры Flex 3 была бы монументальной задачей, если бы вы хотели, чтобы она выглядела чистой и красивой, и было бы безумно пытаться повторно использовать этот код в следующем проекте. Для Spark это совсем несложно, и это 100% mxml. Просто скопируйте всю папку sparkSkins из SDK и начните все менять, и все готово.

Но да, этот проект FlexSpaces - очень хороший пример того, о чем вы говорите. Полностью с открытым исходным кодом.

Приветствия