0 Replies Latest reply on Apr 15, 2010 10:14 AM by ronald29x

    [AIR] Drag Problem (parent & children can receive d&d and HTML Control)

    ronald29x

      Hi,

       

      I have a problem regarding drag and drop in AIR. The d&d involving parent & children that can receive d&d event and the children can contain HTML control. You might want to copy and paste the code below to get a better idea.

       

      The objectives are:

      1. If you drag the green object and drop it in the black area, it should alert "Parent Drop"

      2. If you drag the green object and drop it in the magenta (purple) color, it should alert "Child Drop"

      3. If you drag the green object and drop it in the white (HTML control) color, it should alert "HTML Drop"

       

      The problems:

      1. drag green object to black area, to magenta area, and back again to black area. Drop it, the alert is not shown

      2. drag green object to the white area (HTML control). Drop it, the alert is not shown

       

      Many thanks.

       

       

      The Code:

      <?xml version="1.0" encoding="utf-8"?>
      <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
           <mx:VBox verticalGap="0" x="50" y="50" width="200" height="200" backgroundColor="#000000" horizontalAlign="center" dragEnter="onParentDragEnter(event)" dragDrop="onParentDrop(event)">
                <mx:Canvas id="canvas1" width="50" height="50" backgroundColor="#00ff00" mouseMove="onMouseMove(event)"/>
                <mx:HTML id="html" width="50" height="50" dragEnter="onHtmlDragEnter(event)" dragDrop="onHtmlDrop(event)"/>
                <mx:Canvas id="canvas2" width="60" height="50" backgroundColor="#ff00ff" dragEnter="onChildDragEnter(event)" dragDrop="onChildDrop(event)"/>
           </mx:VBox>
           
           <mx:Script>
                <![CDATA[
                     import mx.controls.Alert;
                     import mx.events.DragEvent;
                     import mx.managers.DragManager;
                     import mx.core.DragSource;
      
                     public function init():void
                     {
                          html.htmlText = '<div style="font-size:small">HTML Control</div>';
                     }
                     
                     public function onMouseMove(event:MouseEvent):void
                     {
                          var dragInitiator:Canvas = event.currentTarget as Canvas;
                          var ds:DragSource = new DragSource();
                          ds.addData("item", "item");
                          DragManager.doDrag(dragInitiator, ds, event, dragInitiator);
                     }
                     
                     public function onChildDragEnter(event:Event):void
                     {
                          trace("onChildDragEnter");
                          DragManager.acceptDragDrop(event.currentTarget as Canvas);
                     }
                     
                     public function onParentDragEnter(event:Event):void
                     {
                          trace("onParentDragEnter");
                          DragManager.acceptDragDrop(event.currentTarget as VBox);
                     }
                     
                     public function onChildDrop(event:DragEvent):void
                     {
                          trace("onchilddrop");
                          Alert.show("Child Drop");
                     }
                     
                     public function onParentDrop(event:DragEvent):void
                     {
                          trace("onparentdrop");
                          Alert.show("Parent Drop");
                     }
                     
                     public function onHtmlDragEnter(event:DragEvent):void
                     {
                          DragManager.acceptDragDrop(event.currentTarget as HTML);
                     }
                     
                     public function onHtmlDrop(event:DragEvent):void
                     {
                          Alert.show("HTML Drop");
                     }
                ]]>
           </mx:Script>
      </mx:WindowedApplication>