Using The Drag-And-Drop Feature - Adobe FLEX 2-MIGRATING APPLICATIONS TO FLEX 2 Manual

Migrating applications to flex 2
Table of Contents

Advertisement

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()

Advertisement

Table of Contents
loading

This manual is also suitable for:

Flex 2

Table of Contents