# Dragging the point with mouse and drawing

**URL:** <https://forum.kirupa.com/t/dragging-the-point-with-mouse-and-drawing/288623>\
**Category:** flash\
**Created:** [May 19, 2009, 4:27am UTC](https://forum.kirupa.com/t/dragging-the-point-with-mouse-and-drawing/288623 "2009-05-19T04:27:30Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![probphp](https://avatars.discourse-cdn.com/v4/letter/p/e99b99/32.png) [@probphp](https://forum.kirupa.com/u/probphp)\
**Post date:** [May 19, 2009, 4:27am UTC](https://forum.kirupa.com/t/dragging-the-point-with-mouse-and-drawing/288623/1 "2009-05-19T04:27:30Z")

</div>

Have a good day to all,

my problem is that when i drag the control point the rectangle is drawing on the different place.

I am enclosing the source where i am drawing the rectangle and also where i am redrawing when the point is dragged.

public function onMouseDownHandler(e:MouseEvent) {  
//trace(“mouse down clicked!”);  
if ( e.target is Stage )  
{  
GL.mouseIniX = mouseX;  
GL.mouseIniY = mouseY;  
switch(GL.isactive)  
{  
case “rect”:  
GL._draw\_obj\_id ++;  
// Create our new square and add some listeners to it to enabled dragging  
var mc:Sprite = new Sprite();  
mc.buttonMode = true;  
mc.name = "Rect_"+GL.\_draw\_obj\_id;  
mc.addEventListener(MouseEvent.MOUSE\_DOWN, startDraging);  
mc.addEventListener(MouseEvent.MOUSE\_UP, stopDraging);  
addChild( mc );  
GL.activeObject = mc;  
//setChildIndex(mc,numChildren-1);  
//drawPointSquare();  
// Hold a reference so we can update its graphics using the drawing API  
GL.mcRef = mc;  
GL.arrDrawObName.push(GL.mcRef.name);  
GL.arrDrawOb.push(GL.mcRef);  
// DRAW!  
stage.addEventListener(Event.ENTER\_FRAME, square);  
/\*  
Xpos = GL.activeObject.x;  
Ypos = GL.activeObject.y;  
Xwidth = GL.activeObject.width;  
Xheight = GL.activeObject.height;  
drawPointSquare();  
\*/  
break;  
case “txt”:  
trace(“text tool not yet!”);  
break;  
case “line”:  
trace(“line tool not yet!”);  
break;  
}  
}  
}

public function square(e:Event):void  
{  
GL.mcRef.graphics.clear();  
GL.mcRef.graphics.lineStyle(3, 0x000000, 1.0);  
GL.mcRef.graphics.beginFill(0xff9900, 1.0);  
GL.mcRef.graphics.drawRect(0, 0, mouseX - GL.mouseIniX, mouseY - GL.mouseIniY);  
GL.mcRef.x = GL.mouseIniX;  
GL.mcRef.y = GL.mouseIniY;  
GL.mcRef.graphics.endFill();  
}

first time i am drawing a rectangle with the above square function.

i am setting the sorroundings point with the belows function.

public function drawPointSquare()  
{

var pointRow:Number = 0;

var pointCol:Number = 0;

for(var i:uint = 0; i\<6; i++)  
{

Xpos = GL.activeObject.x + ((GL.activeObject.width/2) \* pointCol);

if(pointRow == 1)  
{  
//Xpos = GL.activeObject.x;  
Ypos = GL.activeObject.y + Xheight;  
}

var littleSquare:Sprite = new Sprite();  
addChild(littleSquare);  
arrayOfLittleSquare.push(littleSquare);  
littleSquare.graphics.beginFill(0x000000);  
drawShape(littleSquare,10,10);  
littleSquare.graphics.endFill();  
littleSquare.x = Xpos;  
//trace(“existing x position:”+Xpos);  
littleSquare.y = Ypos;

if(i == 2)  
{  
pointCol = 0;  
pointRow = 1;  
}  
else  
pointCol++;

arrayOfLittleSquare\*.addEventListener(MouseEvent.MOUSE\_DOWN, dragSquares);  
arrayOfLittleSquare\*.addEventListener(MouseEvent.MOUSE\_UP, stopSquares);  
}  
}  
public function drawShape(sprite:Sprite, Width:Number, Height:Number):void  
{  
sprite.graphics.moveTo(-Width/2,-Height/2);  
sprite.graphics.lineTo(Width/2,-Height/2);  
sprite.graphics.lineTo(Width/2,Height/2);  
sprite.graphics.lineTo(-Width/2,Height/2);  
sprite.graphics.lineTo(-Width/2,-Height/2);  
}

and when you drag the small point then belows function will be called.

public function dragSquares(e:MouseEvent):void  
{  
e.target.startDrag();  
e.target.addEventListener(Event.ENTER\_FRAME, redrawShape);  
}  
public function stopSquares(e:MouseEvent):void  
{  
e.target.stopDrag();  
e.target.removeEventListener(Event.ENTER\_FRAME, redrawShape);  
}

public function redrawShape(e:Event):void  
{  
drawDynamicShape(GL.activeObject);  
}  
public function drawDynamicShape(sprite:Sprite):void  
{  
sprite.graphics.clear();  
sprite.graphics.lineStyle(3, 0x000000, 1.0);  
sprite.graphics.beginFill(0xff9900, 1.0);  
sprite.graphics.moveTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);  
sprite.graphics.lineTo(arrayOfLittleSquare[1].x,arrayOfLittleSquare[1].y);  
sprite.graphics.lineTo(arrayOfLittleSquare[2].x,arrayOfLittleSquare[2].y);  
sprite.graphics.lineTo(arrayOfLittleSquare[5].x,arrayOfLittleSquare[5].y);  
sprite.graphics.lineTo(arrayOfLittleSquare[4].x,arrayOfLittleSquare[4].y);  
sprite.graphics.lineTo(arrayOfLittleSquare[3].x,arrayOfLittleSquare[3].y);  
sprite.graphics.lineTo(arrayOfLittleSquare[0].x,arrayOfLittleSquare[0].y);  
sprite.graphics.endFill();

/\*  
GL.mcRef.graphics.clear();  
GL.mcRef.graphics.lineStyle(3, 0x000000, 1.0);  
GL.mcRef.graphics.beginFill(0xff9900, 1.0);  
GL.mcRef.graphics.drawRect(0, 0, mouseX - GL.mouseIniX, mouseY - GL.mouseIniY);  
GL.mcRef.x = GL.mouseIniX;  
GL.mcRef.y = GL.mouseIniY;  
GL.mcRef.graphics.endFill();\*/  
}

can i use my same square() function when the small point is dragged to redwaw the rectangle.

If can then how.

Plese share your idea.

Thanks in advance.

PROB