View Full Version : [AS3] Help drawing lines for paths

04-14-2010, 03:41 PM
Hi all,

I am currently working on a game that will allow the user to click on a dude and then draw a free form line. The dude will then follow the path of the line the user drew. If the user clicks on the dude again, the path will be erased and the user can draw a new path. I am using graphics.moveTo() and graphics.lineTo() to draw the paths.

My problem is when I try to put more than one dude on the screen and I wish to redraw a path. When a dude is clicked on, I call graphics.clear() which erases all the paths on the screen. I still have an array of points I can use to reconstruct the lines but that seems like a hassle if I could just not delete the other lines in the first place.

What is the best way to accomplish my goal? Should I be using the graphics API to draw my lines or is there a better way? Should I be putting each line in its own transparent Symbol and then adding them that way? Would that be a problem with overlapping symbols?

I would appreciate any guidance and I can provide more details upon request. I am new to flash/as3 but I am an experienced .NET developer.

04-14-2010, 08:57 PM
You can have each unit draw its own path - that is the simplest and easiest solution.

The problem with that is that it would draw over your own unit. An alternative way which would draw underneath is to have the document class handle it on ENTER_FRAME or some other event. In that event you would call graphics.clear(), and then build the whole thing at once by looping through each instance and drawing their respective paths.

04-15-2010, 01:27 AM
Thanks for the response UnknownJoe.

I actually tried to have each unit draw it's own path, but it doesn't seem that I was able to draw out of the bounds of the unit. Is there some way to get around that?

I may have found a solution involving the Shape class (I'm new to Flash/AS3, I just discovered it) and I'm going to write a quick test to see if I can get that to work.

04-15-2010, 01:29 AM
You can't draw outside the bounds of the unit?! Are you using any sort of camera stuff like Vcam?

04-15-2010, 02:16 AM
I'm too new to know what Vcam is, so I doubt I'm using it.

I solved my problem by writing a Path class that includes both a shape object (the line that I am drawing with the graphics API) and an array of points on that line. It will probably serve me better than using the unit's graphics calls anyways.

Is there a way to control the z order of objects I add to a movie clip? Because my Path's are in front of my units now and I'm not sure if I want them there or not.

Also, I think I am removing my shape the proper way, but can you tell me if this is correct:

public function remove()
pathShape = null;
pathPoints = null;

Thanks for the help!!

04-15-2010, 03:14 AM
Z order can be controlled via setChildIndex(child,index) and swapChildrenAt(index,index), which are in the DisplayObjectContainer class. 0 is the bottom and the numChildren-1 would be the top.

Example (code here would be in the container of anObject):
setChildIndex(anObject,numChildren - 1); sets anObject to be on top.

In my game engine, I stored all of the objects that would be drawn in an array. I then had all of the objects that would be drawn contain a property called depth. Then I sorted the array and repeated the above line to order it according to the depth variable.

//sorts the array based on the variable "depth" in each object

//orders the child array inbuilt into Flash to whatever we want
for each(var obj in containsArray)
setChildIndex(obj ,numChildren - 1);


As for removal of objects, Flash handles most of it quite nicely after you call remove it from its container. The only thing it won't do is remove all of the event listeners (yes, stupid, I know) and remove itself from any arrays you may have had it in, which matters if you do the above solution to z-ordering. graphics.clear() and setting pathShape and pathPoints to null isn't necessary.

04-15-2010, 12:58 PM
Awesome. That helps a bunch. Thanks!