The second function, dragExitHandler, controls the events that occur when the
thumbnail is dragged back away from the main View Panel. The third controls what happens when the
thumbnail is released onto the View Panel. In this case, the appropriate video is placed into the
videoDisplay in the View Panel and played. We set these functions to work with the View Panel
dragDrop, dragEnter and dragExit properties earlier in step 14. In programming, this is often called
associating the functions with the properties (Figure 9-29).
192
CHAPTER 9
Figure 9-29. Dragging functions for thumb VideoDisplay
Figure 9-30 shows the completed project. Make a note of how the video is presented in a different
way in each of the stages of the dragging process. In the thumbnails, we show the videos as static; as
a video is being dragged, it plays at a larger size than in the thumbnails and is partially transparent; and
in the View Panel it plays in the larger size.
Figure 9-30. Final video gallery
Summary
In this chapter you learned two ways of using drag-and-drop in Flex. The first is the simpler method
that applies to List components. These allow you to move text across List components simply by
enabling them. The second method, referred to as manually adding drag-and-drop, is more involved
and ActionScript based. This method provides greater control of the drag-and-drop and allows it to be
used on other components.
You also learned how to use videos in place of images in our gallery.
Pages:
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144