7 Replies Latest reply on Mar 18, 2009 12:27 PM by Hasan Otuome

    Constraining x or y of startDrag()

    Phrankie Level 1

      At times I want to contrain the users drag so that:

      x is constant (the user can only drag the object up or down)

      -- or --

      y is constant (the user can only drag the object left or right)

      I'd also like to constrain drags to a path. Any ideas?

      Thanks, Phrankie


        • 1. Re: Constraining x or y of startDrag()
          markuspedro Level 1
          you can use an if condition:
          if(movie.x>100 && movie.y<700){


          }

          You can built your condition as you want.

          Bye
          • 2. Re: Constraining x or y of startDrag()
            igkuk7
            You can pass a rectangular bounds to the startDrag method which will constrain the area of dragging.

            To make x constant simply set the width of the bounds rectangle to the width of the object being dragged and the x of the bounds to the x of the rectangle then the drag will only go up and down. Similar for y and using the objects width and y position.

            Not sure how to constrain along a path. Perhaps readjusting the bounds rectangle during the drag, i.e. force a drop and restart the drag with new bounds.
            • 3. Constraining x or y of startDrag()
              Phrankie Level 1
              quote:

              Originally posted by: igkuk7
              You can pass a rectangular bounds to the startDrag method which will constrain the area of dragging.

              To make x constant simply set the width of the bounds rectangle to the width of the object being dragged and the x of the bounds to the x of the rectangle then the drag will only go up and down. Similar for y and using the objects width and y position.


              Thanks! Passing in the rectangle works great ... but now there's a mouseUp issue.

              Because I've constrained dragging to vertical, the user can move the mouse outside of the dragged object's width. If the user releases the mouse outside the dragged object, the object keeps dragging—because it never receives the mouseUp.

              Does this mean I need to add a mouseUp listener to the stage, or at the next level of containership?

              Phrankie
              • 5. Constraining x or y of startDrag()
                Hasan Otuome
                Hey Phrankie,

                You can add a ROLL_OUT event listener to the object being dragged and call stopDrag() on the object in your ROLL_OUT event handler...
                • 6. Constraining x or y of startDrag()
                  Phrankie Level 1
                  quote:

                  Originally posted by: hasanotuome
                  Hey Phrankie,

                  You can add a ROLL_OUT event listener to the object being dragged and call stopDrag() on the object in your ROLL_OUT event handler...



                  Thanks, that's close ...

                  I want the user to be able to continue dragging the object after ROLL_OUT. Eventually, when the user releases the mouse, I want the just-dragged object to get the MOUSE_UP, even if the mouse is NOT over the object (a likely occurrence during a constrained drag.) This is just normal user interface ... and I'm perplexed that it's not built it.

                  Users can move the mouse outside of the control region of most standard draggable controls ... and continue dragging the control. Sliders work this way in Flex too, just like my draggable objects.

                  Unfortunately even Flex sliders fail to receive the MOUSE_UP event when the user releases outside the slider thumb region!

                  ??? Who designed that???

                  The user is not be expected to precisely guide the mouse within the control. Nor should they at expected to locate the mouse within the control at the moment of MOUSE_UP—that would require a needless level of dexterity and care with input gestures. And, for the life of me, I can't think of a mainstream interface that operates that way.

                  There must be a simple way. (Adding listeners to the stage and then determining which control was last exited does not strike me as simple.)

                  Am I missing something VERY obvious?

                  q
                  • 7. Re: Constraining x or y of startDrag()
                    Hasan Otuome Level 1
                    Gotcha. In that case, you could add a MOUSE_DOWN event handler on your "drag object" ( draggedObject), then in that handler you could do the following:

                    1) record the current X/Y coordinates of your draggedObject
                    2) record the starting point for the current drag operation (ie, MouseEvent.stageX/Y - draggedObject.x/y)
                    3) add MOUSE_MOVE and MOUSE_UP event listeners to the systemManager instance.

                    Now, in your MOUSE_MOVE handler you'd take care of all of your drag logic and in the MOUSE_UP event handler you'd just remove those listeners on the systemManager instance. This would allow the user to continue dragging even if the mouse leaves the SWF...