11 Replies Latest reply on May 1, 2014 4:07 PM by Ned Murphy

    Drag and Drop Feature in Flash

    heathercalton

      I have multiple elements on my artboard that include the Drag and Drop feature allowing for the elements to be placed on top (overlapping) one another. When the third or fourth element is selected the previous element is forced behind its previous element. Is there anyway to keep the previously placed elements from repositioning, just keeping them stationery. Below is the code applied to the button instance which is inside of its respective movie clip.

       

       

      on (press, dragOver) {

                startDrag(_root.Element2);

      }

      on (release, rollOut, dragOut) {

                stopDrag();

      }

      on (press, release, dragOver, dragOut) {

                _root.x +=9;

                _root.Element2.swapDepths(_root.x);

      }

        • 1. Re: Drag and Drop Feature in Flash
          Ned Murphy Adobe Community Professional & MVP

          How are the previously placed elements repositioning - if you are not moving them, how do they move on their own?

          • 2. Re: Drag and Drop Feature in Flash
            heathercalton Level 1

            There are a handful of elements that reside on the left side of the stage, the user has the ability to select an element and drag it to the right hand side then select other elements to place with that element (overlapping) the previously placed element. Upon initiating the stack, previously stacked rings are repositioning behind the previously stacked ring.

            • 3. Re: Drag and Drop Feature in Flash
              heathercalton Level 1

              For Example: Ring #1 is selected and draged to the desired location, Ring #2 is then selected and draged next to Ring #1, when Ring #3 is selected Ring #2 drops behind Ring #1.

              • 4. Re: Drag and Drop Feature in Flash
                heathercalton Level 1

                So, I've changed the published settings to Action Script 3 which now forces me to place all of the code on one single handler eleminiating the need to apply individual code to the button states that used to reside in the movie clip state. As a result I used the drop and drag feature from the code snippets

                panel. So, now the only issue I have is the inability to have stacking order control.

                 

                 

                 

                Ring2.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag_2);

                function fl_ClickToDrag_2(event:MouseEvent):void

                {

                          Ring2.startDrag();

                }

                 

                 

                stage.addEventListener(MouseEvent.MOUSE_UP, fl_ReleaseToDrop_2);

                function fl_ReleaseToDrop_2(event:MouseEvent):void

                {

                          Ring2.stopDrag();

                }

                • 5. Re: Drag and Drop Feature in Flash
                  Ned Murphy Adobe Community Professional & MVP

                  Your first two responses only repeat what you explained in your original posting, so whatever you meant by objects being repositioned due to dragging other objects remains unexplained.

                   

                  Without that repositioning issue explained, I don't know how to answer your decision to switch to using AS3.  You can easily control the stacking order in AS3, but I hesitate to offer a solution without an explanation of how you intend to have things stacked.

                  • 6. Re: Drag and Drop Feature in Flash
                    heathercalton Level 1

                    Here's a link to what I'm currently working on...

                     

                    http://www.noveldesigns.co/portfolio/rings_2014.html

                     

                    Drag and drop the rings side by side slightly overlapping them and you'll notice a stacking issue.

                    • 7. Re: Drag and Drop Feature in Flash
                      Ned Murphy Adobe Community Professional & MVP

                      I do not notice a stacking issue, though I can imagine one.  You need to explain the stacking issue... what bothers you about it?  HOw does this issue relate to the issue in your original posting?

                      • 8. Re: Drag and Drop Feature in Flash
                        heathercalton Level 1

                        They don't always stack on top of one another. If you play around with a little more you'll notice some of the rings don't stack on top of one another. As of right now that is the only issue, you can ignore my first two posts. I want to make certain that what ever ring is selected is always on top.

                        • 9. Re: Drag and Drop Feature in Flash
                          Ned Murphy Adobe Community Professional & MVP

                          Try...

                           

                          Ring2.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag_2);

                          function fl_ClickToDrag_2(event:MouseEvent):void

                          {

                                    Ring2.startDrag();

                                    this.setChildIndex(Ring2, numChildren-1)

                          }

                           

                          or...

                           

                          Ring2.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag_2);

                          function fl_ClickToDrag_2(event:MouseEvent):void

                          {

                                    Ring2.startDrag();

                                    addChild(Ring2);

                          }

                           

                           

                          You do not have to write unique drag/drop functions for each ring.  You can have a generic one that is shared by all...

                           

                          Ring1.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag); 

                          Ring2.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag); 

                          Ring3.addEventListener(MouseEvent.MOUSE_DOWN, fl_ClickToDrag);

                           

                          function fl_ClickToDrag(event:MouseEvent):void

                          {

                              MovieClip(event.currentTarget).startDrag();

                              addChild(MovieClip(event.currentTarget));

                              stage.addEventListener(MouseEvent.MOUSE_UP, dropRing);

                          }

                           

                          function dropRing(evt:MouseEvent):void

                          {

                              stage.removeEventListener(MouseEvent.MOUSE_UP, dropRing);

                              stopDrag();

                          }

                          • 10. Re: Drag and Drop Feature in Flash
                            heathercalton Level 1

                            This works great. The only thing I see now is when you hit the reset button the images still appear in the center. The reset button takes the user back to an earlier frame.

                            • 11. Re: Drag and Drop Feature in Flash
                              Ned Murphy Adobe Community Professional & MVP

                              If you want things to move back where they came from you need to first store that information for each ring, and use it in a reset function to relocate each one back to where it came from.