0 Replies Latest reply on Apr 28, 2010 7:26 PM by jmandawg

    Drag and Drop not working with spark HGroup with code

    jmandawg Level 1

      Can anyone tell me why my HGroup won't fire the dragEnter dragDrop and DragOver events?

       

       

      Here is the sample code:

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
                     xmlns:s="library://ns.adobe.com/flex/spark"
                     xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
          <fx:Declarations>
              <!-- Place non-visual elements (e.g., services, value objects) here -->
          </fx:Declarations>
          <fx:Script>
              <![CDATA[
                  import mx.core.IUIComponent;
                  import mx.events.DragEvent;
                  import mx.managers.DragManager;
                  private function dragEnterHandler(e:DragEvent):void {
                      DragManager.acceptDragDrop(e.currentTarget as IUIComponent);
                  }
                 
                  private function dragOverHandler(e:DragEvent):void {
                      DragManager.showFeedback(DragManager.COPY);
                  }
                 
                  //user drops src onto target, so re-parent the src to the target
                  private function dragDropHandler(e:DragEvent):void {
                      var img:Image = e.dragInitiator as  Image;
                      var newImg:Image = new Image();
                      newImg.load(img.source);
                      var grp:HGroup = e.currentTarget as HGroup;
                      grp.addElement(newImg);
                  }
                 
                  private function mouseDownHandler(e:MouseEvent):void {
                      DragManager.doDrag(e.currentTarget as IUIComponent, null, e);
                  }
              ]]>
          </fx:Script>
          <s:layout>
              <s:HorizontalLayout />
          </s:layout>
          <s:Panel width="50%" height="100%" title="Drag me">
              <mx:Image source="http://www.google.com/intl/en_ALL/images/logo.gif" mouseDown="mouseDownHandler(event);" />
          </s:Panel>
          <s:Panel width="50%" height="100%" title="to Here">
              <s:HGroup width="100%" height="50%" dragEnter="dragEnterHandler(event);" dragDrop="dragDropHandler(event);"  dragOver="dragOverHandler(event);" />   
              <s:HGroup width="100%" height="50%" dragEnter="dragEnterHandler(event);" dragDrop="dragDropHandler(event);"  dragOver="dragOverHandler(event);" />   
          </s:Panel>
         
      </s:Application>