網頁

2010年3月5日 星期五

容易的 Drag Drop 程式 ~~~

使用Flex 3 就可以很容易作 Drag Drop的程式,比Flex 2好寫很多哦

以 List物件來說

方式一:
直接在兩個List 設定 dropEnabled="true" dragEnabled="true" dragMoveEnabled="true" ,這樣就可以相互拖拉所選的項目

方式二:
以我的Flex 作品 3來說, 有一個GridView 可以將資料拉出來(Drag),放至一個垃圾桶(Drop),那我建議的方式為在GridView 設 dragEnabled 屬性設為true dragMoveEnabled 也設為true
,但在 垃圾桶(為一個Image的物件)要有
dragDrop="dragDropHandler(event);"
dragEnter="dragEnterHander(event);"


private function dragEnterHander(event:DragEvent):void {
if (event.dragSource.hasFormat("items"))
{

var data:Array = event.dragSource.dataForFormat('items') as Array;

//這邊可以寫是否要檢查,是否要接受Drag的資料
var dropTarget1:mx.controls.Image = event.currentTarget as mx.controls.Image;
DragManager.acceptDragDrop(dropTarget1);

}
}


private function dragDropHandler(event:DragEvent):void {
if (event.dragSource.hasFormat("items"))
{
// Explicitly handle the dragDrop event.
event.preventDefault();


// Get drop target. var dropTarget:mx.controls.Image=mx.controls.Image(event.currentTarget);

//要讓垃圾桶換圖片

dropTarget.load(trash2Img);

var data:Array = event.dragSource.dataForFormat('items') as Array;
//為一個ArrayCollection新增Drop的資料
trashAC.addItemAt(data[0],0);

}


}


真是太簡單了~~~

沒有留言:

張貼留言