Flash® Builder™ 4 and Flex® 4 Bible

Chapter 10. Using Layout Containers

IN THIS CHAPTER

• Understanding containers

• Using MX Box containers

• Using Spark Group containers

• Using the BorderContainer

• Using Panel containers

• Using constraint-based layout

• Sizing containers and controls

• Creating scrollable regions

Flex has two types of visual components:

• Containers. Visual components that can contain other objects.

• Controls. Visual components that display information or provide the application with user interaction capabilities.

In Flex 4, you can choose from two sets of containers:

• The MX containers that have been available in previous versions of Flex, such as Canvas, VBox, and HBox.

• The new Spark containers that are designed to work with other Spark components, including Group, VGroup, HGroup, and BorderContainer.

Note

Some containers, such as Panel, are implemented in both the MX and the Spark component set. You can choose from either version, depending on which component features you need. For example, the MX Panel supports use of the ControlBar container to add a footer region with horizontal layout to the bottom of the Panel, while the Spark Panel supports a controlBarContent property that accomplishes the same purpose but enables the use of Spark-based custom skins. Adobe recommends that, whenever possible, you use the Spark containers instead of the MX containers.

The layout of a Flex application is determined through a combination of the application's containership hierarchy and the use of basic (formerly known as absolute) layout tools. ...