A container defines a rectangular region of the drawing surface of Adobe® Flash® Player. Within a container, you define the components, both controls and containers, that you want to appear within the container. Components defined within a container are called children of the container. Adobe® Flex®provides a wide variety of containers, ranging from simple boxes through panels and forms, to elements such as accordions or tabbed navigators that provide built-in navigation among child containers.

At the root of a Flex application is a single container, called the Application container, that represents the entire Flash Player drawing surface. This Application container holds all other containers and components.

A container has predefined rules to control the layout of its children, including sizing and positioning. Flex defines layout rules to simplify the design and implementation of rich Internet applications, while also providing enough flexibility to let you create a diverse set of applications.

About container layout

Containers have predefined navigation and layout rules, so you do not have to spend time defining these. Instead, you can concentrate on the information that you deliver, and the options that you provide for your users, and not worry about implementing all the details of user action and application response. In this way, Flex provides the structure that lets you quickly and easily develop an application with a rich set of features and interactions.

Predefined layout rules also offer the advantage that your users soon grow accustomed to them. That is, by standardizing the rules of user interaction, your users do not have to think about how to navigate the application, but can instead concentrate on the content that the application offers.

Different containers support different layout rules:

• All containers, except the Canvas container, support automatic layout. With this type of layout you do not specify the position of the children of the container. Instead, you control the positions by selecting the container type; by setting the order of the container's children; and by specifying properties, such as gaps, and controls, such as Spacers. For example, to lay out children horizontally in a box, you use the HBox container.
• The Canvas container, and optionally the Application and Panel containers, use absolute layout, where you explicitly specify the children's x and y positions. Alternatively, you can use constraint-based layout to anchor the sides, baseline, or center of the children relative to the parent.

Absolute layout provides a greater level of control over sizing and positioning than does automatic layout; for example, you can use it to overlay one control on another. But absolute layout provides this control at the cost of making you specify positions in detail.

For more information on layout, see Sizing and Positioning Components.

About layout containers and navigator containers

Flex defines two types of containers:

Layout containers 

Control the sizing and positioning of the child controls and child containers defined within them. For example, a Grid layout container sizes and positions its children in a layout similar to an HTML table. Layout containers also include graphical elements that give them a particular style or reflect their function. The DividedBox container, for example, has a bar in the center that users can drag to change the relative sizes of the two box divisions. The TitleWindow control has an initial bar that can contain a title and status information. For more information on these containers, see Using Layout Containers.

Navigator containers 

Control user movement, or navigation, among multiple child containers. The individual child containers, not the navigator container, control the layout and positioning of their children. For example, an Accordion navigator container lets you construct a multipage form from multiple Form layout containers. For more information, see Using Navigator Containers.