A pulldown box will appear with the alignment options. Select center
for horizontalAlign and middle for verticalAlign (Figure 8-18).
164
CHAPTER 8
Figure 8-18. Center alignment of Image component
Looking at the Image component now, you can see that regardless the shape of the image, it will now
be held in the middle (Figure 8-19).
Bringing in the XML
Bringing an XML file into Flex is quite simple, but it does need to be done directly in the Source view:
1. First create an HTTPService that brings the data into the application. Switch to the Source
view, and add the following code directly underneath the opening
tag:
. This code tells the service
where to find the XML, and gives the service a name, galleryData, that we can use later.
The pictures.xml file is in the assets folder that we brought into this project.
2. Define when this service will be called; you can associate it with a button or an event. In this case,
because we want the XML to load right when the application is created, add the following code
directly to the end of the opening tag: creationComplete="galleryData.send()".
Your new MXML should look like Figure 8-20.
Figure 8-19. Image component
with center alignment
165
FLEX PHOTO GALLERY
Figure 8-20. MXML with HTTPService
The data in the XML file now gets placed into the dataProvider called galleryData when we run the
project. We??™ll use this dataProvider to populate our thumbnails.
Pages:
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128