Tuesday, March 6, 2012

Good Flex Interview Questions [Flex Basics (Part 3)]


You can read updated part1and part2 here.

Question: What is the easiest way to achieve drag-and-drop behavior in list?
Answer: We can set dragEnabled, dropEnabled etc properties for list-based controls and if they contain same objects then it works smoothly. We can also control drag-and-drop mechanism using DragManager.



Question: How can we control drag-and-drop using custom drag methods.
Answer:Assume that we want to create an application where we are able to drag a pop-up into a bottom dock component  When a pop-up is dragged into botton-dock it will get minimized and take some action. So first thing its to provide drag support for the pop-up. We will add an event-handler for mouseDown event for the pop-up.

 private function onMouseDownHandler(event:MouseEvent):void  

           {  
                var dragLinkFromPopUp:IUIComponent = event.target as  
                 IUIComponent;  
                var dragSource:DragSource = new DragSource();  
                dragSource.addData(dragLinkFromPopUp, "LinkFromPopUp");  
                DragManager.doDrag(dragLinkFromPopUp,dragSource,event);  
           }  

Here our pop-up is the target for mouse-down event. We are also setting dragSource property becuase we want to put some condition for acceptDragDrop() by DragManager.
Then the next thing will be to accept the object when it enters into our BottomDock:

 addEventListener(DragEvent.DRAG_ENTER,onDockItemDragEnterHandler);  
                addEventListener(DragEvent.DRAG_DROP,onDockItemDropHandler);  
and write the function body as:

           private function onDockItemDragEnterHandler(event:DragEvent):void  

           {  
                if(event.dragSource.hasFormat("LinkFromPopUp"))  
                {  
                DragManager.acceptDragDrop(event.currentTarget as   
                IUIComponent);  
                }  
           }  
           private function onDockItemDropHandler(event:DragEvent):void   
           {  
                var dragItem:Object =   
                       event.dragSource.dataForFormat("LinkFromPopUp");  
                //Do your Processing.
           }  
We can read more about drag-drop here:

Coming Next:
More basic questions about:
Custom Component and Examples
ExternalInterface API and FA Bridge
Shared Object
and a separate post for about java-flex interaction, lcds/blazeDS, blazeDS Spring integration etc.

So Did you find this post helpful? What would you like to be improved/added? Please spent some time to provide your feedback that can help improve it.

2 comments:

Flex Lover said...

Hey Akhil,
Can u post something about creating custom components in ActionScript by overriding createChildren() etc methods.
And what is the purpose of overriding these methods?

Difference between ActionScript CustomComponent and MXML CustomComponent?

Regards
Flex Lover

Akhil Mittal said...

Flex Lover, Give me some time I am planning to write few posts regarding it. I have got many requests for that, planning up some good stuff now a days :)