MACROMEDIA FLEX BUILDER-USING FLEX BUILDER Use Manual page 42

With the insertion point still blinking in the Panel container, specify the values for the following
3.
properties in the Attributes panel:
Common > title
Styles > marginBottom
Styles > marginLeft
Styles > marginRight
Styles > marginTop
Insert an HBox container inside the Panel container by clicking anywhere inside the Panel
4.
container and clicking the HBox button in the Containers category of the Insert bar.
Flex Builder inserts an empty HBox container in the component.
With the insertion point still blinking in the HBox container, specify the value for the following
5.
property in the Attributes panel:
Styles > verticalAlign
Insert a Canvas container to position the product thumbnail by clicking anywhere inside the
6.
HBox container, clicking the Canvas button on the Insert bar, clearing the default values in the
dialog box that appears, and clicking OK.
Flex Builder inserts an empty Canvas container in the component.
With the Canvas container still selected, specify the values for the following properties in the
7.
Attributes panel:
Size > height
Size > width
Common > clipContent
Insert a VBox container for the product name and price by clicking inside the right edge of the
8.
HBox container (without clicking inside the Canvas container), and clicking the VBox button
on the Insert bar.
Flex Builder inserts an empty VBox container in the component.
Insert a ControlBar container by clicking inside the Panel container outside and below the
9.
HBox container, and clicking the ControlBar button on the Insert bar.
Flex Builder inserts an empty ControlBar container and automatically positions it at the lower
edge of the Panel container.
With the insertion point still blinking in the ControlBar container, specify the value for the
10.
following property in the Attributes panel:
Common > id
To make sure the component fits correctly in the Flex Store user interface, select the Panel
11.
container and clear the following properties in the Attributes panel:
Size > height
Size > width
42 Chapter 2: Flex Builder Tutorials
: Product Details
: 8
: 8
: 8
: 8
: middle
: 140
: 150
: false
: ctrl
:
: