Flex 4 Cookbook

Chapter 2. Containers

The Flex Framework provides two sets of containers: MX and Spark. The introduction of the Spark architecture to the Flex 4 SDK offers a level of abstraction between containers and layouts not available in the MX architecture. An MX container internally manages the size and position of its children based on specified properties and styles. To modify the layout rules of a MX container, you often create a subclass of a similar container or the base mx.core.Container class and override methods such as updateDisplayList() and measure(). In contrast, Spark containers are separated from layout management and allow for a developer to specify layouts available in the spark.layouts package or create custom LayoutBase-based layouts to manage the size and position of child elements. The separation of responsibilities for Spark containers provides enhanced runtime performance in rendering because layout is handled through delegation.

Included in the Spark layout container architecture are two base classes, GroupBase and SkinnableContainerBase. Both handle visual elements, but only the latter provides skinning capabilities for the container. The spark.components.Group and spark.components.DataGroup classes are extensions of GroupBase; both are non-skinnable containers, but they differ in how child elements are declared and represented on their display lists. A Group container holds children that are implementations of IVisualElement and that are added either through MXML ...