List컴포넌트의 드래그 드롭 이벤트 함수를 등록하고 이벤트 표출용 List 에 기록한다. Clear 버튼을 사용하여 기록된 이벤트 목록을 지울 수도 있다.

소스 및 폼

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
				fontFamily="굴림체" fontSize="16" >
				
	<mx:Script>
	<![CDATA[
	
	import mx.events.DragEvent;
	import mx.managers.DragManager;
   import mx.core.DragSource;
	
	private var EventCount:int = 0;
	
	private function WriteEvent(str:String):void {
		EventCount = EventCount + 1;
		EventListData.addItemAt({label:EventCount.toString() + ">" + str}, 0);
	}
	private function lbListDragStart(src:String,event:DragEvent):void {
		WriteEvent(src+" Drag Start");
	} 
	
	private function lbListDragOver(src:String,event:DragEvent):void {
		WriteEvent(src+" Drag Over");
	}
	 
	private function lbListDragExit(src:String,event:DragEvent):void {
		WriteEvent(src+" Drag Exit");
	}
	 
	private function lbListDragEnter(src:String,event:DragEvent):void {
		WriteEvent(src+" Drag Enter");
	}
	 
	private function lbListDragDrop(src:String,event:DragEvent):void {
		WriteEvent(src+" Drag Drop");
		WriteEvent( "DragSource formats [" + event.dragSource.formats.toString() + "]" );
	}

	private function lbListDragComplete(src:String,event:DragEvent):void {
		WriteEvent(src+" Drag Complete");
	}

	]]>
	</mx:Script>
	
	<mx:ArrayCollection id="LeftData1" >
		<mx:Object label="1 Item" />
		<mx:Object label="2 Item" />
		<mx:Object label="3 Item" />
	</mx:ArrayCollection>

	<mx:ArrayCollection id="EventListData" >
		<mx:Object label="Event List Data" />
	</mx:ArrayCollection>
	
	<mx:ArrayCollection id="DragSourceListData" >
	</mx:ArrayCollection>
				
	<mx:Panel y="42" width="362" height="250" layout="absolute" 
			horizontalCenter="0" title="단방향">
		<mx:List id="lbLeft0" 
			     dataProvider="{LeftData1}" 
			     dragEnabled="true"
			     dropEnabled="true" 
			     dragMoveEnabled="{cbDragMove.selected}"  	
			     y="60" width="162" height="136" horizontalCenter="-86"  
			     dragStart="lbListDragStart('left',event)" 
			     dragOver="lbListDragOver('left',event)" 
			     dragExit="lbListDragExit('left',event)" 
			     dragEnter="lbListDragEnter('left',event)" 
			     dragDrop="lbListDragDrop('left',event)" 
			     dragComplete="lbListDragComplete('left',event)"
			     >
		
		</mx:List>
		<mx:List id="lbRight0"
			     dropEnabled="true" 
			     dragEnabled="true"  	
			     dragMoveEnabled="{cbDragMove.selected}"  	
			     dragStart="lbListDragStart('right',event)" 
			     dragOver="lbListDragOver('right',event)" 
			     dragExit="lbListDragExit('right',event)" 
			     dragEnter="lbListDragEnter('right',event)" 
			     dragDrop="lbListDragDrop('right',event)" 
			     dragComplete="lbListDragComplete('right',event)"
			     y="60" width="162" height="136" horizontalCenter="84" > 
		</mx:List>
		<mx:CheckBox x="17" y="10" label="이동" fontWeight="bold" id="cbDragMove"/>
	</mx:Panel>
	
	<mx:List id="lbEventList" 
		     dataProvider="{EventListData}"
		     y="305" width="362" height="187" horizontalCenter="0" >
	</mx:List>
	
	<mx:Button y="500" label="CLEAR" width="362" 
        click="{EventListData.removeAll()}" horizontalCenter="0"/>
	
</mx:Application>

예제 실행