A Flash Developer Resource Site

Results 1 to 10 of 10

Thread: Creating a drag and drop without a specified space

  1. #1
    Junior Member
    Join Date
    Jul 2010
    Posts
    6

    Creating a drag and drop without a specified space

    I have a drop and drop, which works fine, but i don't want it to go outside the window.

    How can I do it?

    Thanks

  2. #2
    Senior Member
    Join Date
    Jul 2009
    Posts
    113
    Here is a source example for and rectangular and circular boundaries.

  3. #3
    Junior Member
    Join Date
    Jul 2010
    Posts
    6
    Thanks for replying, but it's hard to understand seeing as I started to code in actionscript today! Most of it was googled, with some tweaks to change it to the way I need it

    Anyway, my document is 900 x 600px.

    Now what I have is this...
    MC_Login.onPress = function(){
    startDrag(this, false, false, false, 900, 600)
    }

    MC_Login.onRelease = MC_Login.onReleaseOutside = function(){
    this.stopDrag()
    }
    This does a top and left boundary, but can not get it to do the whole.. boundary. Although the window will eventually be resizable. So I'd perhaps like a 10px margin.. around it, so it doesn't actually touch the edges.. and ofcourse, set the drag and drop area based on how big the window is.

    Also, for a bonus question, how could I make an object appear dead center of the movie?

  4. #4
    Senior Member
    Join Date
    Jul 2009
    Posts
    113
    Seems like you are using AS2.

    The link I provided is AS3 so most likely it won't work if you tried it.

    Your code for startDrag should look something like this...
    startDrag(true, 10, 10, Stage.width - 20, Stage.height - 20);

    For more information about startDrag have a look at this link.

  5. #5
    Junior Member
    Join Date
    Jul 2010
    Posts
    6
    Quote Originally Posted by Ziggwies View Post
    Seems like you are using AS2.

    The link I provided is AS3 so most likely it won't work if you tried it.

    Your code for startDrag should look something like this...
    startDrag(true, 10, 10, Stage.width - 20, Stage.height - 20);

    For more information about startDrag have a look at this link.
    startDrag( target ,[ lock , left , top , right , bottom ] )

    I found this so I thought.. well target is MC_Login, lock is a boolean, but I don't understand what the lock left top right and bottom are.

    All I know is that my movie has a 900 x 600 default size, but this can be resizable... so I need more further help.

  6. #6
    Junior Member
    Join Date
    Jul 2010
    Posts
    6
    I found a smooth drag, but cannot get current window size and set a margin of 10px so it doesn't touch the sides, also, if I clicked in the middle of the movie, and move a little bit, the object moves so it's left corner is where my mouse is, which i don't like that at all.

    Actionscript Code:
    MovieClip.prototype.beginDrag = function(target, lock, l, t, r, b){
        if (typeof target == "string"){
            target = eval(target);
            if (!target) return trace("Warning: Invalid MovieClip for beginDrag. "+target);
        }else if (!(target instanceof MovieClip)){
            b=r; r=t; t=l; l=lock; lock=target; target=this;
        }
        if (target.$dragMethod) target.endDrag();
        target.$dragMethod = {MM:target.onMouseMove};
        ASSetPropFlags(target,"$dragMethod",1,1);
        target.addProperty("onMouseMove",arguments.callee.getMM,arguments.callee.setMM);
        ASSetPropFlags(target,"onMouseMove",3);
        var constrain = (arguments.length > 1);
        var off_x = 0, off_y = 0;
        if (!lock){
            off_x = target._parent._xmouse-target._x;
            off_y = target._parent._ymouse-target._y;
        }
        target.$dragMethod.drag = function(){
            target._x = target._parent._xmouse-off_x;
            target._y = target._parent._ymouse-off_y;
            if (constrain){
                if (typeof l == "object"){
                    t = l.ymin;
                    r = l.xmax;
                    b = l.ymax;
                    l = l.xmin;
                }
                if (target._x < l) target._x = l;
                else if (target._x > r) target._x = r;
                if (target._y < t) target._y = t;
                else if (target._y > b) target._y = b;
            }
            updateAfterEvent();
        }
    }
    MovieClip.prototype.beginDrag.getMM = function(){
        this.$dragMethod.drag();
        return this.$dragMethod.MM;
    }
    MovieClip.prototype.beginDrag.setMM = function(f){
        this.$dragMethod.MM = f;
    }                
    MovieClip.prototype.endDrag = function(target){
        if (arguments.length){
            if (typeof target == "string") target = eval(target);
            if (!target) return trace("Warning: Invalid MovieClip for beginDrag. "+target);
        }else target = this;
        ASSetPropFlags(target,"onMouseMove",0,3);
        delete target.onMouseMove;
        if (target.$dragMethod.MM) target.onMouseMove = target.$dragMethod.MM;
        delete target.$dragMethod;
        target.startDrag(); // for _droptarget
        target.stopDrag();
    }

    // on a movieclip: press to drag
    MC_Login.onPress = function(){
        this.beginDrag(true,0,0,300,300); // constrained to 300x300 square
    }
    MC_Login.onRelease = MC_Login.onReleaseOutside = function(){
        this.endDrag();
    }

    Your Stage.width - 20, Stage.height - 20 doesn't do anything -.- It's still stopped at the top and left without a margin and can go forever on bottom and right.

  7. #7
    Senior Member
    Join Date
    Jul 2009
    Posts
    113
    Oops I forgot to account for the actual space of the object.

    Try this code instead...

    Code:
    var left:Number   = 10 + MC_Login._width/2;
    var top:Number    = 10 + MC_Login._height/2;
    var right:Number  = Stage.width  - MC_Login._width/2  - 10;
    var bottom:Number = Stage.height - MC_Login._height/2 - 10;
    
    MC_Login.onPress = function(){
    	this.startDrag(true, left, top, right, bottom);
    }
    
    MC_Login.onRelease =
    MC_Login.onReleaseOutside = function(){
    	this.stopDrag();
    }
    Also make sure MC_Login is centered in its own local coordinates space.

  8. #8
    Junior Member
    Join Date
    Jul 2010
    Posts
    6
    Actionscript Code:
    MovieClip.prototype.beginDrag = function(target, lock, l, t, r, b){
        if (typeof target == "string"){
            target = eval(target);
            if (!target) return trace("Warning: Invalid MovieClip for beginDrag. "+target);
        }else if (!(target instanceof MovieClip)){
            b=r; r=t; t=l; l=lock; lock=target; target=this;
        }
        if (target.$dragMethod) target.endDrag();
        target.$dragMethod = {MM:target.onMouseMove};
        ASSetPropFlags(target,"$dragMethod",1,1);
        target.addProperty("onMouseMove",arguments.callee.getMM,arguments.callee.setMM);
        ASSetPropFlags(target,"onMouseMove",3);
        var constrain = (arguments.length > 1);
        var off_x = 0, off_y = 0;
        if (!lock){
            off_x = target._parent._xmouse-target._x;
            off_y = target._parent._ymouse-target._y;
        }
        target.$dragMethod.drag = function(){
            target._x = target._parent._xmouse-off_x;
            target._y = target._parent._ymouse-off_y;
            if (constrain){
                if (typeof l == "object"){
                    t = l.ymin;
                    r = l.xmax;
                    b = l.ymax;
                    l = l.xmin;
                }
                if (target._x < l) target._x = l;
                else if (target._x > r) target._x = r;
                if (target._y < t) target._y = t;
                else if (target._y > b) target._y = b;
            }
            updateAfterEvent();
        }
    }
    MovieClip.prototype.beginDrag.getMM = function(){
        this.$dragMethod.drag();
        return this.$dragMethod.MM;
    }
    MovieClip.prototype.beginDrag.setMM = function(f){
        this.$dragMethod.MM = f;
    }                
    MovieClip.prototype.endDrag = function(target){
        if (arguments.length){
            if (typeof target == "string") target = eval(target);
            if (!target) return trace("Warning: Invalid MovieClip for beginDrag. "+target);
        }else target = this;
        ASSetPropFlags(target,"onMouseMove",0,3);
        delete target.onMouseMove;
        if (target.$dragMethod.MM) target.onMouseMove = target.$dragMethod.MM;
        delete target.$dragMethod;
        target.startDrag(); // for _droptarget
        target.stopDrag();
    }

    var left:Number   = 10 + MC_Login._width/2;
    var top:Number    = 10 + MC_Login._height/2;
    var right:Number  = Stage.width  - MC_Login._width/2  - 10;
    var bottom:Number = Stage.height - MC_Login._height/2 - 10;

    // on a movieclip: press to drag
    MC_Login.onPress = function(){
        this.beginDrag(true, left, top, right, bottom); // constrained to 300x300 square
    }
    MC_Login.onRelease = MC_Login.onReleaseOutside = function(){
        this.endDrag();
    }

    This doesn't have boundaries now? -.-

    What do you mean centered in it's own local co-ordinate spaces?

  9. #9
    Senior Member
    Join Date
    Jul 2009
    Posts
    113
    This doesn't have boundaries now? -.-
    Interesting since it's working from my end.

    I noticed you are using beginDrag and endDrag instead of startDrag and stopDrag.

    What do you mean centered in it's own local co-ordinate spaces?
    I'm assuming the object you are dragging is a symbol. So you need to make sure it's centered inside its own local coordinates. Or in other words make sure its registration point is at the center.

  10. #10
    Junior Member
    Join Date
    Jul 2010
    Posts
    6
    Yes, I'm using begin and endDrag because I have got the functions above where its used to define it - It's a smooth drag, and it works just need the bounderies set. Try out my code and try and get it to work. ^^

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center