ひっかき絵
クギを持って、黒いところをカリカリ削ってみてください。子供のころ、よくやりましたよねー。
ペンツール
まず、マウスの動きに合わせて描画するペンツール(クレヨン)の作り方から。クレヨンのムービークリップにリンクしているクラスは、こんな風な型です。
dynamic class Pen extends MovieClip{
var onDrawing = false;//描画中かどうか
var onGet = false;//ペンを持っているかどうか
function onPress(){
if( onPencase() )//ペンケース内なら
getOrPutPen();//拾うか置くか
else//ペンケースの外なら
startDraw();//描きはじめる
}
function onRelease(){//マウスを放したとき、
if( onDrawing )//描いてる途中なら
stopDraw();//描くをやめる
}
function onEnterFrame(){
if( onGet )//ペンを持ってたら
chaseMouse();//マウスを追う
if( onDrawing )//描いてる途中なら
draw();//描きつづける
}
}
プログラムを書くときは、最初は、日本語と、それを英訳したメソッド名で、大枠を組んでみるといいでしょう。こうしてみると、構造化やオブジェクト指向の理解が早くなるように思います。各内部メソッドの中身の実装は、末尾に掲載します。
ActionScriptでマスク操作
絵が描けるようになったら、あとは、マスクの使い方を覚えるだけです。
冒頭のFlashのレイヤー構造と、それを実現するコードは、次のようになってます。実世界のソレとは重ねる順番が違うところに注意してください。

attachMovie('blacklayer','blacklayer',1);
attachMovie('colorlayer','colorlayer',2);
createEmptyMovieClip("mask", 3);
colorlayer.setMask(mask);
ここまで準備できたら、前に紹介したペンツールで、maskレイヤーに対して描画してやれば、冒頭のようになります(ペンツールとほとんど同じなので、ソースは載せません)。
付録 - ペンツールの全ソース
dynamic class Pen extends MovieClip{
var onDrawing = false;//描画中かどうか
var onGet = false;//ペンを持っているかどうか
function onPress(){
if( onPencase() )//ペンケース内なら
getOrPutPen();//拾うか置くか
else//ペンケースの外なら
startDraw();//描きはじめる
}
function onRelease(){//マウスを放したとき、
if( onDrawing )//描いてる途中なら
stopDraw();//描くをやめる
}
function onEnterFrame(){
if( onGet )//ペンを持ってたら
chaseMouse();//マウスを追う
if( onDrawing )//描いてる途中なら
draw();//描きつづける
}
/** 以下、内部関数 **/
var _prev_x;
var _prev_y;
var line;
var linecolor;
function setColor(color){
this.linecolor = color;
}
function chaseMouse(){
_x = _root._xmouse;
_y = _root._ymouse;
}
function onPencase(){
return hitTest(_root.pencase);
}
function getOrPutPen(){
onDrawing = false;
if( !onGet ){
_rotation = -30;
_x = _root._xmouse;
_y = _root._ymouse;
}else{
_rotation = 0;
this.stopDrag();
}
onGet = !onGet;
}
function startDraw(){
_rotation = -60;
onDrawing = true;
line = _root.createEmptyMovieClip("line_mc",
_root.getNextHighestDepth());
line.lineStyle(5,linecolor,100)
_prev_x = _root._xmouse;
_prev_y = _root._ymouse;
this.startDrag();
}
function draw(){
chaseMouse();
line.moveTo(_prev_x,_prev_y);
_prev_x = _root._xmouse;
_prev_y = _root._ymouse;
line.lineTo(_prev_x,_prev_y);
}
function stopDraw(){
_rotation = -30;
onDrawing = false;
}
}