flex關于拖放的類

DragManager 類管理拖放操作，您可以使用它來将資料從 Flex 應用程式中的一個位置移動到另一位置。例如，您可以選擇一個對象（如 List 控件中的項目）或一個 Flex 控件（如 Image 控件），然後将其拖至另一個元件進行添加。

DragManager 的所有方法和屬性都是靜态的，是以不需要為其建立執行個體。

所有 Flex 元件都支援拖放操作。Flex 為 List、Tree 和 DataGrid 控件的拖放操作提供了附加支援。

當使用者使用滑鼠選擇某個項目時，所選元件稱為拖動啟動器。拖動操作期間顯示的圖像稱為拖動代理。

當使用者将拖動代理移動到其他元件時，系統會向該元件發送

dragEnter

事件。如果該元件接受拖動，即可成為放置目标，并接收

dragOver

、

dragExit

和

dragDrop

事件。

拖動操作完成後，會向拖動啟動器發送

dragComplete

DragSource 類中包含正被拖動的資料。資料可以采用多種格式，具體取決于啟動拖動的控件的類型。

每種資料格式都使用一個字元串進行辨別。

hasFormat()

方法用于确定對象是否包含使用相應格式的資料。

dataForFormat()

方法用于檢索指定格式的資料。

可以使用

addData()

方法直接添加資料，也可以使用

addHandler()

方法間接添加資料。

addHandler()

方法會注冊一個回調，請求該資料時将調用此回調。添加非本機格式的資料可能需要進行大量計算或轉換，此時該方法就非常有用。例如，如果您具有原始聲音資料，則可以添加 MP3 格式處理程式。僅當請求 MP3 資料時才執行 MP3 轉換

DragEvent 類代表作為拖放操作部分進行分派的事件對象。

<?xml version="1.0" encoding="utf-8"?>

<!-- dragdrop\DandDImageCopyMove.mxml -->

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="horizontal">

<mx:Script>

<![CDATA[

import mx.managers.DragManager;

import mx.core.DragSource;

import mx.events.DragEvent;

import flash.events.MouseEvent;

[Embed(source='./assets/20.jpg')]

public var globeImage:Class;

// mouseMove資料管理用來定義圖檔控件的功能。

private function mouseOverHandler(event:MouseEvent):void

{

var dragInitiator:Image=Image(event.currentTarget);

var ds:DragSource = new DragSource();

//向拖動源添加資料和相應的格式 String。此方法不傳回值。

ds.addData(dragInitiator, "img");

// 拖動管理器是以圖檔作為拖動代理。

var p_w_picpathProxy:Image = new Image();

p_w_picpathProxy.source = globeImage;

p_w_picpathProxy.height=10;

p_w_picpathProxy.width=10;

DragManager.doDrag(dragInitiator, ds, event,

p_w_picpathProxy, -15, -15, 1.00);

}

// dragEnter事件管理器用來定義放置目标。

private function dragEnterHandler(event:DragEvent):void {

if (event.dragSource.hasFormat("img"))

//Canvas接受拖放

DragManager.acceptDragDrop(Canvas(event.currentTarget));

// dragOver事件管理器設定拖放操作為複制還是移動。

// 複制或移動會影響在dragComplete事件管理器中的操作。

private function dragOverHandler(event:DragEvent):void

{

if (event.dragSource.hasFormat("img")) {

if (event.ctrlKey) {

//設定拖放操作的回報訓示符

DragManager.showFeedback(DragManager.COPY);

return;

else {

DragManager.showFeedback(DragManager.MOVE);

DragManager.showFeedback(DragManager.NONE);

// dragDrop事件管理器設定圖檔控件在目标容器中的位置。

private function dragDropHandler(event:DragEvent):void {

var draggedImage:Image =

event.dragSource.dataForFormat('img') as Image;

var dropCanvas:Canvas = event.currentTarget as Canvas;

var newImage:Image=new Image();

newImage.source = draggedImage.source;

newImage.x = dropCanvas.mouseX;

newImage.y = dropCanvas.mouseY;

dropCanvas.addChild(newImage);

// dragComplete事件管理器用來完成複制或移動圖檔。

private function dragCompleteHandler(event:DragEvent):void {

event.dragInitiator as Image;

var dragInitCanvas:Canvas =

event.dragInitiator.parent as Canvas;

if (event.action == DragManager.MOVE)

dragInitCanvas.removeChild(draggedImage);

}

]]>

</mx:Script>

<mx:Panel

title="不同類型的非清單類控件中複制移動圖檔示例" width="90%" height="90%"

horizontalAlign="center"

verticalAlign="middle">

<mx:HBox width="100%" height="100%">

<mx:Canvas

width="200" height="200"

borderStyle="solid"

backgroundColor="#FFF6D5">

<mx:Image id="myimg"

source="@Embed(source='./assets/20.jpg')"

mouseMove="mouseOverHandler(event);"

dragComplete="dragCompleteHandler(event);"/>

</mx:Canvas>

backgroundColor="#FEDEF1"

dragEnter="dragEnterHandler(event);"

dragOver="dragOverHandler(event);"

dragDrop="dragDropHandler(event);">

</mx:HBox>

</mx:Panel>