Tutorial: Building custom components with Flex Builder
31
In Design view, the component should look similar to the following figure if you select the Panel
container:
Note:
The component will scale to fit in the space allotted to it in the flexstore.mxml file.
Finish the footer of the shopping cart component
According to the component mock-up, the footer has one button to let the user delete a selected
item in the shopping cart, and another button to let the user proceed to the checkout area. The
footer should also display the total price of all the products in the cart.
1.
Make sure the component file, CartView.mxml, is open in Flex Builder.
2.
In Design view, click anywhere inside the ControlBar container at the lower edge of the Panel
container.
Make sure the blinking insertion bar appears inside the ControlBar container.
3.
Insert a button by clicking the Button control in the Controls category of the Insert bar, and
specifying the values for the following properties in the Attributes panel:
■
Common > label
:
Delete
■
Size > width
:
75
4.
Insert a second button by clicking to the right of the Delete button in the ControlBar container,
clicking the Button control on the Insert bar, and specifying the values for the following
properties in the Attributes panel:
■
Common > label
:
Checkout
■
Size > width
:
75
Summary of Contents for FLEX-FLEX BUILDER
Page 56: ...56 Flex Builder Tutorials...