Action Script 3 draw in front of a movie clip? - actionscript-3

Question

I'm new flash and action script.
here is the problem.
i have created a simple application. and added just two items to the stage. a movie clip object and a button object. movie clip object has mouse event listeners set to draw on it. but when i draw, the lines are drawn behind the movie clip object (on the stage), i want to draw it on the object.
here is my code
var write: Boolean;
write = false;
board.addEventListener(MouseEvent.MOUSE_DOWN, startWriting);
board.addEventListener(MouseEvent.MOUSE_MOVE, continueWriting);
board.addEventListener(MouseEvent.MOUSE_UP, stopWriting);
board.addEventListener(MouseEvent.MOUSE_OUT, stopWriting);
btnHide.addEventListener(MouseEvent.MOUSE_DOWN, hideBoard);
var g:Graphics = graphics;
g.lineStyle(1, 0x0000ff);
function startWriting(e:MouseEvent):void {
g.moveTo(mouseX, mouseY);
write = true;
}
function continueWriting(e:MouseEvent):void {
if(write) {
g.lineTo(mouseX, mouseY);
}
}
function stopWriting(e:MouseEvent):void {
write = false;
}
function hideBoard(e:MouseEvent):void {
if (board.visible){
board.visible = false;
}
else {
board.visible = true;
}
}
so the question is how do i draw on the movie clip object

Answer 1

Each MovieClip have their own graphics property. The contents you added in are always in front of the current movieclip graphics.
The solution is just add a Shape as child of your MovieClip :
var shape : Shape = new Shape;
addChild( shape );
var g:Graphics = shape .graphics;
g.lineStyle(1, 0x0000ff);
function startWriting(e:MouseEvent):void {
g.moveTo(mouseX, mouseY);
write = true;
}
function continueWriting(e:MouseEvent):void {
if(write) {
g.lineTo(mouseX, mouseY);
}
}