Основные нововведения в Adobe Flex 4

Увидев заголовок этой статьи сразу возникло желание поделится более свежим опытом, а именно — новыми вкусняшками в не таком уже и новом Flex SDK 4.0 (для справки — сейчас есть также SDK 4.1 и 4.5 бета). Итак поехали…

Namespace

Первое отличие которое бросается в глаза при переходе на новый флекс, это пространство имен:

было:

xmlns:mx="http://www.adobe.com/2006/mxml"

стало:

xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/halo"

"http://ns.adobe.com/mxml/2009"

— как и прежде содержит все базовые элементы языка, такие как базовый класс Object, Number, Boolean, Array, а также теги встроенные в MXML компилятор <fx:Script>, <fx:Declarations> и <fx:Style>.

library://ns.adobe.com/flex/halo

— содержит все компоненты которые раньше лежали в пакете mx.*.

library://ns.adobe.com/flex/spark

— содержит все новые компоненты, которые лежат в пакете spark.*. Этот пакет также включает RPC классы (например RemoteObject) и некоторые эффекты и элементы графики, некоторые из них дублируются в пакетах mx.*.

Spark компоненты

В новом SDK разработчики существенно переделали старые компоненты сильно облегчив их и урезав значительную часть возможностей. В основном это было сделано с целью оптимизации, новые компоненты получили название Spark. В большинстве случаев разница между halo и spark компонентами не заметна, но есть и сильно измененные компоненты. Теперь все визуальные компоненты имеют некий базовый класс который определяет базовою функциональность (обработку событий, поведение, свойства) и скины (skins), которые определяют вид и прорисовку. Например класс Button в дополнение теперь имеет ButtonSkin класс в пакете spark.skins.*. Скины связаны с компонентами через CSS (defaults.css). Привязка на примере кнопки выглядит так:

Button {
 skinClass: ClassReference("mx.skins.spark.FxButtonSkin");
}

Ниже постараюсь описать самые важные, как по мне, новые компоненты:

Group

Group — новый базовый контейнер. Group определяет новые локальные координаты размещения элементов внутри себя. По сути, это старый Canvas, только сильно упрощенный. В группу можно добавлять layout для определения правил отображения компонентов внутри группы (или можно использовать уже готовые классы VGroup и HGroup).

Shapes

Добавлены 3 новых базовых класса форм:

• Rectangles (

  <rect

  >)
• Ellipse (

  <ellipse

  >)
• Lines (

  <line

  >)

По умолчанию граница всех форм имеет ширину 0, поэтому чтобы увидеть на экране эти компоненты вам так же нужно будет использовать

<stroke

> чтобы прорисовать границу или

<fill

> чтобы заполнить определенным цветом:

<s:Rect height="100" width="200">
<s:stroke>
<s:Stroke color="0x000000" weight="1"/>
</s:stroke>
</s:Rect

>

DataGroup

DataGroup — класс-контейнер для отображения данных с помощью item renderer. Дочерним элементом DataGroup может быть любой объект:

<s:DataGroup itemRenderer="MyItemRenderer">
<s:layout>
<s:VerticalLayout/>
</s:layout>
<mx:ArrayCollection>
<fx:Object firstName="Dima" lastName="Pupkin"/>
</mx:ArrayCollection>
</s:DataGroup

>

Scroller

Теперь почти у всех компонентов нету скролов по умолчанию. Если вам нужен скрол придется добавлять вручную:

<s:Scroller width="100%" height="100%" hasFocusableChildren="true">
<s:Group />
</s:Scroller

>
Как по мне, это гораздо лучше чем, увидеть совсем не нужный скрол не понятно где.

Заключение

Собственно это все что мне припоминается из разительных отличий. Еще следует отметить — старайтесь избегать использования старых компонентов, иначе теряется смысл использования новой версии. Между версиями 4.0, 4.1 и 4.5 особо больших различий не заметил, разве что в одной из версий появляется компонент, а в другой версии его уже нет (например SimpleText или FlexGlobals). Собственно 4-ка мне больше нравится по впечатлениям, она как бы дает больший контроль над поведением при меньших усилиях.

Подробней можно почитать здесь.