7 Replies Latest reply: Jun 21, 2012 4:39 PM by kglad RSS

    Tutorials for drag and drop multiple objects on a sigle target

    lightwavemac Community Member

      I hoping someone could direct me to tutorials that show how to make drag and drop multiple objects to a single target and get different results based on which object I drag.  

        • 1. Re: Tutorials for drag and drop multiple objects on a sigle target
          kglad MVP

          use any drag-and-drop as3 tutorial that you can understand.  in the mouseup listener function your can use the event's currentTarget to determine which object was dropped and then execute the corresponding code.

          • 2. Re: Tutorials for drag and drop multiple objects on a sigle target
            lightwavemac Community Member

            I found a drag and drop tutorial and I have three movie clips and one target, but I'm not sure how to and the correct script to the mouseup listener function. For instance once one of the objects is dropped I want to go to a new frame. I copied my code below.

             

             

             

             

            var hitArray:Array = new Array(hitTarget1,hitTarget1,hitTarget1);

            var dropArray:Array = new Array(drop1,drop2,drop3);

            var positionsArray:Array = new Array();

             

             

             

            for (var i:int = 0; i < dropArray.length; i++) {

            dropArray[i].buttonMode = true;

            dropArray[i].addEventListener(MouseEvent.MOUSE_DOWN, mdown);

            dropArray[i].addEventListener(MouseEvent.MOUSE_UP, mUp);

             

             

            positionsArray.push({xPos:dropArray[i].x, yPos:dropArray[i].y});

            }

             

             

             

            function mdown(e:MouseEvent):void {

            e.currentTarget.startDrag();

            setChildIndex(MovieClip(e.currentTarget), numChildren - 1);

            }

             

             

             

            function mUp(e:MouseEvent):void {

            var dropIndex:int = dropArray.indexOf(e.currentTarget);

            var target:MovieClip = e.currentTarget as MovieClip;

             

             

            target.stopDrag();

             

             

            if (target.hitTestObject(hitArray[dropIndex])) {

            target.x = hitArray[dropIndex].x;

            target.y = hitArray[dropIndex].y;

            }else{

            target.x = positionsArray[dropIndex].xPos;

            target.y = positionsArray[dropIndex].yPos;

            }

            }

            • 3. Re: Tutorials for drag and drop multiple objects on a sigle target
              kglad MVP

               

               

               

              var hitArray:Array = new Array(hitTarget1,hitTarget1,hitTarget1);

              var dropArray:Array = new Array(drop1,drop2,drop3);

              var positionsArray:Array = new Array();

               

               

               

              for (var i:int = 0; i < dropArray.length; i++) {

              dropArray[i].buttonMode = true;

              dropArray[i].addEventListener(MouseEvent.MOUSE_DOWN, mdown);

              dropArray[i].addEventListener(MouseEvent.MOUSE_UP, mUp);

               

               

              positionsArray.push({xPos:dropArray[i].x, yPos:dropArray[i].y});

              }

               

               

               

              function mdown(e:MouseEvent):void {

              e.currentTarget.startDrag();

              setChildIndex(MovieClip(e.currentTarget), numChildren - 1);

              }

               

               

               

              function mUp(e:MouseEvent):void {

              var dropIndex:int = dropArray.indexOf(e.currentTarget);

              var target:MovieClip = e.currentTarget as MovieClip;

               

               

              target.stopDrag();

               

               

              if (target.hitTestObject(hitArray[dropIndex])) {

              target.x = hitArray[dropIndex].x;

              target.y = hitArray[dropIndex].y;

              if(dropIndex==0){

              somemovieclip.gotoAndStop(someframe);

              } else if(dropIndex==1){

              somemovieclip.gotoAndStop(someotherframe);

              } else {

              somemovieclip.gotoAndStop(anotherframe);

              }

              }else{

              target.x = positionsArray[dropIndex].xPos;

              target.y = positionsArray[dropIndex].yPos;

              }

              }

              • 4. Re: Tutorials for drag and drop multiple objects on a sigle target
                lightwavemac Community Member

                Thanks for your feedback thus far. I included my movie clips and go and stop frames. Is what I have below correct.

                 

                 

                 

                stop();

                 

                 

                 

                 

                 

                 

                 

                 

                var hitArray:Array = new Array(hitTarget1,hitTarget1,hitTarget1);

                var dropArray:Array = new Array(drop1,drop2,drop3);

                var positionsArray:Array = new Array();

                 

                 

                 

                for (var i:int = 0; i < dropArray.length; i++) {

                dropArray[i].buttonMode = true;

                dropArray[i].addEventListener(MouseEvent.MOUSE_DOWN, mdown);

                dropArray[i].addEventListener(MouseEvent.MOUSE_UP, mUp);

                 

                 

                positionsArray.push({xPos:dropArray[i].x, yPos:dropArray[i].y});

                }

                 

                 

                 

                function mdown(e:MouseEvent):void {

                e.currentTarget.startDrag();

                setChildIndex(MovieClip(e.currentTarget), numChildren - 1);

                }

                 

                 

                 

                function mUp(e:MouseEvent):void {

                var dropIndex:int = dropArray.indexOf(e.currentTarget);

                var target:MovieClip = e.currentTarget as MovieClip;

                 

                 

                target.stopDrag();

                 

                 

                if (target.hitTestObject(hitArray[dropIndex])) {

                target.x = hitArray[dropIndex].x;

                target.y = hitArray[dropIndex].y;

                 

                 

                 

                 

                 

                 

                if(dropIndex==0){

                drop1.gotoAndStop(2);

                } else if(dropIndex==1){

                drop2.gotoAndStop(3);

                } else {

                drop3.gotoAndStop(4);

                }

                }else{

                target.x = positionsArray[dropIndex].xPos;

                target.y = positionsArray[dropIndex].yPos;

                }

                }

                • 5. Re: Tutorials for drag and drop multiple objects on a sigle target
                  kglad MVP

                  it's possible that's correct but noone could determine that from the information you've given.  you should be able to see how your app is performing and determine if that is what you want.

                  • 6. Re: Tutorials for drag and drop multiple objects on a sigle target
                    lightwavemac Community Member

                    I inserted a new frame and placed text on the layer, but when I drop the movie clips on the target, it doesn't jump to the new frame with the text added, just the drag and drop function works. Do you think it would help if you could view the actual FLA, Is there anywhere I can upload it, or is this just a hopeless cause.

                    • 7. Re: Tutorials for drag and drop multiple objects on a sigle target
                      kglad MVP

                      use the trace function to debug your actionscript:

                       

                      function mUp(e:MouseEvent):void {

                      var dropIndex:int = dropArray.indexOf(e.currentTarget);

                      var target:MovieClip = e.currentTarget as MovieClip;

                       

                       

                      target.stopDrag();

                       

                       

                      if (target.hitTestObject(hitArray[dropIndex])) {

                      target.x = hitArray[dropIndex].x;

                      target.y = hitArray[dropIndex].y;

                       

                       

                       

                      trace(dropIndex);

                      // if this traces something other than -1, put trace functions in frame 2 of drop1, frame 3 of drop2 etc.

                       

                       

                      if(dropIndex==0){

                      drop1.gotoAndStop(2);

                      } else if(dropIndex==1){

                      drop2.gotoAndStop(3);

                      } else {

                      drop3.gotoAndStop(4);

                      }

                      }else{

                      target.x = positionsArray[dropIndex].xPos;

                      target.y = positionsArray[dropIndex].yPos;

                      }

                      }