I have to do the same for a project the ui component is a combo box
kindly note: You will need some icons to be created you can listed to
the events being fired.
Added To Selection Removed From Selection
**
?xml version=1.0 encoding=utf-8?
mx:Canvas
horizontalScrollPolicy=off verticalScrollPolicy=off
xmlns:mx=http://www.adobe.com/2006/mxml;
xmlns:flexlib=http://code.google.com/p/flexlib/;
mx:Metadata
[ Event(name=addedToSelection,
type=com.yourcompany.common.events.ToFromListBoxChangeEvent) ]
[ Event(name=removedFromSelection,
type=com.yourcompany.common.events.ToFromListBoxChangeEvent) ]
[ Event(name=selectionChanged, type=flash.events.Event) ]
/mx:Metadata
mx:Script
![CDATA[
import
com.yourcompany.common.events.ToFromListBoxChangeEvent;
import mx.events.DragEvent;
import mx.collections.ArrayCollection;
/** Events fired due to data changes */
public static const ADDED_TO_SELECTION :
String=
addedToSelection;
public static const REMOVED_FROM_SELECTION :
String=
removedFromSelection;
public static const SELECTION_CHANGED :
String= selectionChanged;
[Bindable] private var _dsAvailable:ArrayCollection;
[Bindable] private var _dsSelected:ArrayCollection;
public var filterKeys:Array = new Array();
private var _filterFunction:Function;
/**
* Transfer data between the source list and the
destination list
*/
private function MoveDataBetweenList(srcList:List,
destList:List,
type:String):void{
var srcData:ArrayCollection =
srcList.dataProvider as ArrayCollection;
var destData:ArrayCollection =
destList.dataProvider as
ArrayCollection;
var itemIndex:uint;
/* temp object will hold the object before the
object is moved... */
var itemData:Object;
/* list of objects that have been moved */
var changeList:Array = new Array();
if( type == ALL ){
while( srcData.length ){
itemData =
srcData.removeItemAt( 0 );
destData.addItem(
itemData );
changeList.push(
itemData );
}
}else{
while(
srcList.selectedIndices.length ){
itemIndex =
srcList.selectedIndices[0];
itemData =
srcData.removeItemAt( itemIndex );
destData.addItem(
itemData );
changeList.push(
itemData );
}
}
/* ok let us now fire the change event.
*/
srcData.refresh();
destData.refresh();
/** fire selection changed event */
fireChangeEvent( destList, changeList );
} // MoveDataBetweenLists...
/**
* function called when a drag-drop occurs on one of
the lists...
*/
protected function dragDropHandler( e:DragEvent ):void{
var changeList:Array = e.dragSource.dataForFormat(
e.dragSource.formats[0] ) as Array;
var destList:List = e.currentTarget as List;
fireChangeEvent( destList, changeList );
} //dragDropHandler...
/* central location that fires the change events... */
protected function fireChangeEvent( destList:List,
changeList:Array) : void {
/* dispatch an event with the object reference... */
switch ( destList.name ) {
case selectedList :
trace(
