During this time an image called the drag
proxy is displayed that represents the selected component. We can control this proxy image to
get various effects. The original component is referred to as the drag source.
The dropping. When the dragged component is put over the top of another component, that
component becomes a drop target. Flex analyzes whether the data of the dragged component
can go into the drop target. If it can, then you can release the dragged component and it enters
the drop target. If it cannot, then the dragged component returns to its original position.
Drag-and-drop with List controls
Some components make drag-and-drop very easy because it is built into those components. Examples
of the components that work this way include the List, DataGrid, Tile List, and Tree controls. We??™ll create
an example of this kind of built-in drag-and-drop first.
1. Create a new Flex application (Figure 9-1).
Figure 9-1. Creating a new Flex application
178
CHAPTER 9
2. Name the project DragAndDrop (Figure 9-2). Click Next and then Finish.
Figure 9-2. Naming your project
179
FLEX VIDEO GALLERY WITH DRAG-AND-DROP
3. In this project we??™ll passing data across three different lists. In the Design view, start by placing
one list component onto the stage (Figure 9-3).
Figure 9-3. New List component
This component will serve as our template for the future ones.
4. As you saw in Chapter 8, components have many more editable properties than are presented
in the Standard view of the Properties panel.
Pages:
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136