1. Start with a new Flex project (Figure 11-2).
Figure 11-2. Creating a new Flex application
2. Name the project CH11-FlexForms and click Finish (Figure 11-3). Flex creates a default MXML
file called main.mxml.
219
CREATING FORMS: THE ???WILL FLEX FOR FOOD??? REGISTRATION PAGE
Figure 11-3. Name the project CH11-FlexForms.
3. Select the Design view in the MXML editor.
4. Start by placing a Panel component in the middle of our MXML editor. This Panel will serve to
frame our form and help us control the layout (Figure 11-4).
Figure 11-4. Panel component
220
CHAPTER 11
5. Type mainPanel for the ID and for the Title type Will Flex for Food Registration, as shown in
Figure 11-5.
Figure 11-5. Give the panel an ID and title.
6. We want the form to stay centered in the browser window regardless of size and we want the
Panel to be large enough to hold our information. In this case, 400 by 400 is a good size. To
keep the form centered, set the layout handles to Center (Figure 11-6).
Figure 11-6. Panel layout
221
CREATING FORMS: THE ???WILL FLEX FOR FOOD??? REGISTRATION PAGE
Adding the Accordion component
You??™ll find the Accordion component in the Navigators folder of the Components panel (Figure 11-7).
This set of components is useful for moving through larger amounts of data where space is limited.
Figure 11-7. Navigators folder in
Components panel
7. Drag an Accordion component onto the panel we have just created (Figure 11-8).
Figure 11-8. Drag an Accordion component onto the panel.
Pages:
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158