A Flash Developer Resource Site

Results 1 to 2 of 2

Thread: Drag n Drop

  1. #1
    Registered User
    Join Date
    Oct 2012
    Posts
    1

    Drag n Drop

    Hi,
    I found this tutorial and code on a website Flash and Math. It does what I want but I would like to make it work with movieclips. You can paste this script in an AS3 file and make a swf., it does everything.
    Code:

    //Part I -- Set up the graphics



    var holder:Sprite = new Sprite();

    var block1:Sprite = new Sprite();

    var block2:Sprite = new Sprite();

    var block3:Sprite = new Sprite();



    this.addChild(holder);

    this.addChild(block1);

    this.addChild(block2);

    this.addChild(block3);



    holder.graphics.beginFill(0xDDDDDD);

    holder.graphics.lineStyle(2,0);

    holder.graphics.moveTo(0,0);

    holder.graphics.lineTo(0,300);

    holder.graphics.lineTo(100,300);

    holder.graphics.lineTo(100,0);

    holder.graphics.endFill();

    holder.x = 350;

    holder.y = 50;



    block1.graphics.beginFill(0xDDDDFF);

    block1.graphics.lineStyle(0,0);

    block1.graphics.moveTo(0,0);

    block1.graphics.drawRect(0,0,100,100);

    block1.graphics.endFill();

    block1.x = 50;

    block1.y = 50;



    block2.graphics.beginFill(0xFFDDDD);

    block2.graphics.lineStyle(0,0);

    block2.graphics.moveTo(0,0);

    block2.graphics.drawRect(0,0,100,100);

    block2.graphics.endFill();

    block2.x = 50;

    block2.y = 200;



    block3.graphics.beginFill(0xDDFFDD);

    block3.graphics.lineStyle(0,0);

    block3.graphics.moveTo(0,0);

    block3.graphics.drawRect(0,0,100,100);

    block3.graphics.endFill();

    block3.x = 175;

    block3.y = 100;

    // Global variables to keep up with things



    var movingBlock:Sprite;

    var startingPt:Point = new Point();

    var placed:int = 0;





    // Part II -- Add drag and drop functionality



    block1.addEventListener(MouseEvent.MOUSE_DOWN, startBlockMove);

    block2.addEventListener(MouseEvent.MOUSE_DOWN, startBlockMove);

    block3.addEventListener(MouseEvent.MOUSE_DOWN, startBlockMove);



    function startBlockMove(evt:MouseEvent):void {

    movingBlock = Sprite(evt.currentTarget);

    startingPt.x = movingBlock.x;

    startingPt.y = movingBlock.y;

    stage.addEventListener(MouseEvent.MOUSE_MOVE, moveBlock);

    }



    function moveBlock(e:MouseEvent):void {

    movingBlock.x = stage.mouseX;

    movingBlock.y = stage.mouseY;

    }



    stage.addEventListener(MouseEvent.MOUSE_UP, stopMotion);



    function stopMotion(evt:MouseEvent):void {

    stage.removeEventListener(MouseEvent.MOUSE_MOVE, moveBlock);

    snapInPlace();

    movingBlock = new Sprite();

    startingPt = new Point();

    }



    function snapInPlace():void {

    if (holder.hitTestObject(movingBlock)) {

    movingBlock.x = holder.x;

    movingBlock.y = holder.y + 100*placed;

    placed++;

    movingBlock.removeEventListener(MouseEvent.MOUSE_D OWN, startBlockMove);

    }

    else {

    movingBlock.x = startingPt.x;

    movingBlock.y = startingPt.y;

    }

    }

  2. #2
    Senior Member
    Join Date
    Jun 2008
    Posts
    549
    Delete the following lines of code and create four movie clips with the respective instances names: holder, block1, block2 and block3.

    Code:
    var holder:Sprite = new Sprite();
    var block1:Sprite = new Sprite();
    var block2:Sprite = new Sprite();
    var block3:Sprite = new Sprite();
    
    this.addChild(holder);
    this.addChild(block1);
    this.addChild(block2);
    this.addChild(block3);
    
    holder.graphics.beginFill(0xDDDDDD);
    holder.graphics.lineStyle(2,0);
    holder.graphics.moveTo(0,0);
    holder.graphics.lineTo(0,300);
    holder.graphics.lineTo(100,300);
    holder.graphics.lineTo(100,0);
    holder.graphics.endFill();
    holder.x = 350;
    holder.y = 50;
    
    
    block1.graphics.beginFill(0xDDDDFF);
    block1.graphics.lineStyle(0,0);
    block1.graphics.moveTo(0,0);
    block1.graphics.drawRect(0,0,100,100);
    block1.graphics.endFill();
    block1.x = 50;
    block1.y = 50;
    
    block2.graphics.beginFill(0xFFDDDD);
    block2.graphics.lineStyle(0,0);
    block2.graphics.moveTo(0,0);
    block2.graphics.drawRect(0,0,100,100);
    block2.graphics.endFill();
    block2.x = 50;
    block2.y = 200;
    
    block3.graphics.beginFill(0xDDFFDD);
    block3.graphics.lineStyle(0,0);
    block3.graphics.moveTo(0,0);
    block3.graphics.drawRect(0,0,100,100);
    block3.graphics.endFill();
    block3.x = 175;
    block3.y = 100;

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