Using the drag-and-drop feature
When you convert drag-and-drop code, be aware of the following changes:
The
method takes an additional required attribute,
■
doDrag()
attribute is the MouseEvent object that contains the mouse information for the start of the
drag.
All drag-and-drop-specific events are now DragEvent class events.
■
For a drop target to accept an item for dropping, it must call the
■
method, not use the
The following example lets you drag one of two colored canvases onto a larger canvas to apply
the color to the larger canvas:
Flex 1.x:
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script><![CDATA[
import mx.managers.Dragmanager;
function dragIt(event, text, format) {
var ds:mx.core.DragSource = new mx.core.DragSource();
ds.addData(text, format);
DragManager.doDrag(event.target, ds, mx.containers.Canvas,
{backgroundColor:event.target.getStyle('backgroundColor'),
width:30, height:30});
}
function doDragEnter(event) {
if (event.dragSource.hasFormat('color')) {
event.handled = true;
}
}
function doDragDrop(event) {
var data = event.dragSource.dataForFormat('color');
myCanvas.setStyle("backgroundColor", data);
}
]]></mx:Script>
<mx:HBox>
<mx:Canvas backgroundColor="#FF0000" borderStyle="solid" width="30"
height="30" mouseMove="dragIt(event, 'red', 'color')"/>
<mx:Canvas backgroundColor="#00FF00" borderStyle="solid" width="30"
height="30" mouseMove="dragIt(event, 'green', 'color')"/>
</mx:HBox>
<mx:Label text="Drag the item into this canvas"/>
<mx:Canvas id="myCanvas" backgroundColor="#FFFFFF" borderStyle="solid"
width="100" height="100" dragEnter="doDragEnter(event)"
dragDrop="doDragDrop(event)"/>
</mx:Application>
178
Migration Patterns
property.
event.handled
. This
mouse_event
acceptDragDrop()
Need help?
Do you have a question about the FLEX 2-MIGRATING APPLICATIONS TO FLEX 2 and is the answer not in the manual?
Questions and answers