Flex 2 Developer's Guide > Building User Interfaces for
Flex Applications > Using Layout Containers > Panel layout container

Panel layout container

A Panel layout container includes a title bar, a title, a status message area (in the title bar), a border, and a content area for its children. Typically, you use Panel containers to wrap self-contained application modules. For example, you could define several Panel containers in your application where one Panel container holds a form, a second holds a shopping cart, and a third holds a catalog.

The Panel container has a layout property that lets you specify one of three types of layout: horizontal, vertical (default), or absolute layout. Horizontal and vertical layout use the Flex automatic layout rules to lay out children horizontally or vertically. Absolute layout requires you to specify each child's x and y position relative to the panel contents area, or to use constraint-based layout styles to anchor one or more sides or the container horizontal or vertical center relative to the panel content area. For examples of using absolute and constraint-based layout in a container, see Creating and using a Canvas control. For detailed information on using these layout techniques, see Sizing and Positioning Components.

The following example shows a Panel container with a Form container as its child:

Panel container with a Form container as a child

The Panel container has the following default sizing characteristics:

Property	Default value
Default size	The height is large enough to hold all of its children at the default height of the children, plus any vertical gaps between the children, the top and bottom padding, the top and bottom borders, and the title bar. The width is the larger of the default width of the widest child plus the left and right padding of the container, or the width of the title text, plus the border.
Padding	4 pixels for the `top`, `bottom`, `left`, and `right` values.

Property

Default value

Default size

The height is large enough to hold all of its children at the default height of the children, plus any vertical gaps between the children, the top and bottom padding, the top and bottom borders, and the title bar.

The width is the larger of the default width of the widest child plus the left and right padding of the container, or the width of the title text, plus the border.

Padding

4 pixels for the top, bottom, left, and right values.

For complete reference information, see Panel in Adobe Flex 2 Language Reference.

Subtopics

Creating a Panel layout container

Adding a ControlBar container to a Panel container

Flex 2.01

Send me an e-mail when comments are added to this page | Comment Report

Current page: http://livedocs.adobe.com/flex/201/html/layouts_065_37.html