Where does the stroke lie?
October 18th, 2006 . by polyGeekI did some poking around in the Flash help files and couldn’t find any documentation to back this up but it seems that when using the drawingAPI that the stroke is half-inside and half-outside of the shape that you draw.
Take the following code. I’m drawing a square from (0, 0) to (100, 100). That should have a width of 100, right? Well, it would if the stroke were 0 but in this case I’m going to make the stroke 10.
var mc:MovieClip = this.createEmptyMovieClip(”mc”,0);
// stroke=10, color=white, alpha=100
mc.lineStyle(10, 0xFFFFFF, 100);
mc.moveTo(0, 0);
mc.lineTo(0, 100);
mc.lineTo(100, 100);
mc.lineTo(100, 0);
mc.lineTo(0, 0);
trace(”width: ” + mc._width); // output: width: 110
trace(”height: ” + mc._height); // output: height: 110
So if you wanted to draw this rectangle with a stroke of 10 and have the MovieClip’s width actually be 100 you would have to draw from (5, 5) to (95, 95).
One thing that I discovered during this process is that the DrawingAPI centers strokes over the position where they are drawn. (read more about that here.) Once I had that down it was simple to draw the interface in pixel perfect positions. …