Panel drag and drop : Panel Action « Container « Flex

1. Flex
2. Container
3. Panel Action

Panel drag and drop

            
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="horizontal"
    creationComplete="creationHandler();">

    <mx:Script>
        
            import mx.utils.ObjectUtil;
            import mx.events.DragEvent;
            import mx.collections.ArrayCollection;

            private function creationHandler():void
            {
                var collection:ArrayCollection = new ArrayCollection( ['A', 'B', 'C'] );
                contactList.dataProvider = collection;
            }

            private function dropHandler( evt:DragEvent ):void
            {
                var listItem:Object = evt.dragSource.dataForFormat( "items" );
                var index:int = contactList.calculateDropIndex( evt );
                ArrayCollection( contactList.dataProvider ).setItemAt(ObjectUtil.copy( listItem ), index );
            }

      
    </mx:Script>

    <mx:Panel title="Contact List:"
        width="200" height="200">
        <mx:List id="contactList"
            width="100%" height="100%"
            dragEnabled="true"
            dropEnabled="true"
            dragMoveEnabled="false"
            dragComplete="dropHandler(event);"
            />
    </mx:Panel>

</mx:Application>
    

   
    
    
    
    
    
    
    
    
    
    
    
  

Related examples in the same category

1.	Panel mouse down effect
2.	Register an event handler for the Panel container
3.	logs the change event to flashlog.txt each time the user changes panels
4.	Panel rollOver and rollOut events