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

    Drag and Drop not working with spark HGroup with code

    jmandawg

      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>