1 Reply Latest reply on Apr 20, 2011 1:30 AM by Lifebelt

    dragging doesn't work in AIR

    christoferek

      Hi,

       

      I have an application that works correctly in Flash.

       

      When I'm trying to make it to work in AIR environment it doesn't work.

      There are no errors. Just doesn't drag the canvas.

       

      What could cause to stop it working in AIR?

       

      I use Flex 4.1 SDK.

       

      Below you find the complete code that you can copy and paste to newly created project as AIR application.

       

      Chris

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="780"
          creationComplete="creationCompleteHandler()">

       

       

       

          <mx:Canvas id="invisible_holder" width="100%" height="100%" backgroundColor="#ff0000" backgroundAlpha="0"  />
          <mx:Canvas id="BlueCanvas" x="97" y="263" width="300" height="300" backgroundColor="blue" backgroundAlpha="0.1">
            
              <mx:Canvas id="RedCanvas"     x="26" y="38" width="200" height="200"  mouseDown="childMouseDown(event)"
                   backgroundColor="red">
                   <mx:Label id="dd" text="labe lll">
                     
                   </mx:Label>
              </mx:Canvas>
            
          </mx:Canvas>
        
          <mx:Script>
              <![CDATA[
                  import mx.core.DragSource;
                  import mx.core.UIComponent;
                  import mx.events.DragEvent;

       

                  import mx.managers.DragManager;     

       

       

       

                  //Variables used to hold the image's location
                  public var xOff:Number;
                  public var yOff:Number;
                  public var xThisBefore:Number;
                  public var yThisBefore:Number;
                  public var xThisAfter:Number;
                  public var yThisAfter:Number;

                  //Create the event listeners for the drag operations.
                  private function creationCompleteHandler():void
                  {
                      BlueCanvas.addEventListener(DragEvent.DRAG_DROP,dropEnter);
                      BlueCanvas.addEventListener(DragEvent.DRAG_ENTER, applicationDragEnter);
                  }      
                
                  private function dropEnter(event:DragEvent):void{
                      xThisAfter = this.mouseX;
                      yThisAfter = this.mouseY;
                      RedCanvas.x = xOff + (xThisAfter - xThisBefore);
                      RedCanvas.y = yOff + (yThisAfter - yThisBefore);

       

                      changeZIndex(1);
                      RedCanvas.addEventListener(DragEvent.DRAG_DROP,dropEnter);
                      RedCanvas.addEventListener(DragEvent.DRAG_ENTER, applicationDragEnter);  
                  }
                
                  private function changeZIndex( direction:int ): void {
                      var newIndex:int = BlueCanvas.getChildIndex(RedCanvas) + direction;

       

       

       

                      if( newIndex >= 0 && newIndex < BlueCanvas.numChildren ) {
                      BlueCanvas.setChildIndex(RedCanvas, newIndex );
                      }
                  }
                
                  //The application accepts the drag drop.
                  //(except when the user drags the red canvas over the blue canvas)   
                  private function applicationDragEnter(event:DragEvent):void
                  {
                      if (event.dragSource.hasFormat("data"))
                      {
                          DragManager.acceptDragDrop(event.currentTarget as UIComponent);
                      }
                  }
                
                  //Start the drag drop operation
                  private function childMouseDown(event:MouseEvent):void
                  {
                      xThisBefore = this.mouseX;
                      yThisBefore = this.mouseY;

       

       

       

                      xOff = RedCanvas.x;
                      yOff = RedCanvas.y;
                    
                      var data:String = "data";
                      var source:DragSource= new DragSource();
                      source.addData(data, "data");
                      DragManager.doDrag(event.currentTarget as UIComponent, source, event);
                  }          
              ]]>
          </mx:Script>

       

      </mx:WindowedApplication>

        • 1. Re: dragging doesn't work in AIR
          Lifebelt

          if you need only to drag a canvas you could use startdrag and stopdrag

           

          something like:

           

          <?xml version="1.0" encoding="utf-8"?>

               <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="780"

                    creationComplete="creationCompleteHandler()">

           

           

           

                         <mx:Canvas id="BlueCanvas" x="97" y="263" width="300" height="300" backgroundColor="blue">

                         </mx:Canvas>

           

               <mx:Script>

                    <![CDATA[

                         //Create the event listeners for the drag operations.

                         private function creationCompleteHandler():void

                         {

                              BlueCanvas.addEventListener(MouseEvent.MOUSE_DOWN,startdrag);

                              BlueCanvas.addEventListener(MouseEvent.MOUSE_UP, stopdrag);

                         }      

           

                         private function startdrag(e:MouseEvent):void

                         {

                              BlueCanvas.startDrag();

                         }

           

                         private function stopdrag(e:MouseEvent):void

                         {

                              BlueCanvas.stopDrag();

                         }

                    ]]>

               </mx:Script>

           

          </mx:WindowedApplication>

           

           

          hope this help