arrows at end of lines 1

[cruise95]

Hello,

I aAm trying to make a VISIO-like program. I am doing pretty good, but I am unsure about how to make the arrows. I have seen this done, but how? Should I use hitTest to get the boundaries? I know the from-MC instanceName and the to-MC instanceName...so I can draw and update the lines (every 25 miliseconds). But I would like arrows to show the parent-child relationship/links. Any suggestions or example code would be great!

Thank you -
Frank

 

[wangbar]

If you're using MX or above you could use the drawing API to draw your lines and arrows which would probably be simpler than using movieClips and hitTest. Here's something that draws lines and arrows dynamically:

startLine = function () {
	//check mouse position
	xInit = this._xmouse;
	yInit = this._ymouse;
	this.onMouseMove = function() {
		//draw line to mouse position
		clip = this.createEmptyMovieClip('line', lineDepth);
		clip.lineStyle(1);
		clip.moveTo(xInit, yInit);
		clip.lineTo(this._xmouse, this._ymouse);
		updateAfterEvent();
	};
};
endLine = function () {
	// finish line and draw arrowhead
	this.drawArrows = function() {
		xPoint = this._xmouse;
		yPoint = this._ymouse;
		// angle of the line
		angle = Math.atan2(yInit-yPoint, xInit-xPoint);
		// angle of arrowhead lines (45 degrees converted to radians)
		differential = (45/180*Math.PI);
		arrowAngle1 = angle+differential;
		arrowAngle2 = angle-differential;
		// draw arrowhead
		line.moveTo(xPoint, yPoint);
		line.lineTo(xPoint+Math.cos(arrowAngle1)*size, yPoint+Math.sin(arrowAngle1)*size);
		line.lineTo(xPoint+Math.cos(arrowAngle2)*size, yPoint+Math.sin(arrowAngle2)*size);
		line.lineTo(xPoint, yPoint);
	};
	delete this.onMouseMove;
	lineDepth++;
	this.drawArrows();
};
//set up
size = 10;
lineDepth = 1;
this.onMouseDown = startLine;
this.onMouseUp = endLine;

 

[cruise95]

Thank you wangbar...that's what I was looking for