Flashで筆順再生のflaソース配布します

色と太さを設定できるようにして１週間ぐらい放置してしまったFlashで筆順再生ですが、ちょっと興味が他に移りつつあるので、とりあえずソースだけ公開しておきます。内容は前回のままです。

AM8:00にソースファイル更新。太いブラシ設定の部分の修正とデバッグ用の不要クラスのインポート指定をカットしました。

lineDraw2.zip(11KB): flash8形式

筆順再生部分をカットして、単純にペンツールとしての利用もできるかと思います。

ペンツールの部分は、キャンバス上でマウスダウンした時点で、ブラシの色と太さを配列に格納、onEnterFrameで座標を記録しつつlineToで線を描画。一筆上げるごとに、キャンバス上の絵をdrawし、ビットマップとして貼り付けるしくみになってます。何枚分か前のBitmapDataを置いておく＆一筆分の配列を削除で、アンドゥも可能だし、attachBitmapされたビットマップに対しては消しゴムの実装もたぶんできます。

筆順再生は、お絵かき時に配列aに記録しておいたブラシ色＆太さ＆座標データをonEnterFrameで再現させているだけです。

コードは以下のスクリプトを_rootのフレームスクリプトに記述しているだけです。

import flash.display.BitmapData;
import flash.geom.Point;

var lineWidth:String = "N";//Bold,Normal,Small
var lineColor:Number = 0xff0000;
var a:Array = new Array();

bmpImage = new BitmapData(board._width, board._height, true, 0x000000);
bmpHolder = board.createEmptyMovieClip("bmpHolder", 10);
lineHolder = board.createEmptyMovieClip("lineHolder", 11);

replayBmpImage = new BitmapData(board._width, board._height, true, 0x000000);
replayBmpHolder = board.createEmptyMovieClip("replayBmpHolder", 4);
replayLineHolder = board.createEmptyMovieClip("replayLineHolder", 5);

board.onPress = function() {
    a.push(lineWidth+lineColor);//ex."B160025"
    lineHolder.lineStyle(brushSize(lineWidth), lineColor);
    lineHolder.moveTo(this._xmouse, this._ymouse);
    this.onMouseMove = drawLine;
};
board.onRelease = board.onReleaseOutside=function () {
    lineToBmp();
    lineHolder.clear();
    delete this.onMouseMove;
};
function drawLine() {
    var pt = new Point(this._xmouse, this._ymouse);
    board.lineHolder.lineTo(pt.x, pt.y);
    a.push(pt.x);
    a.push(pt.y);
}
function lineToBmp() {
    bmpImage.draw(lineHolder);
    bmpHolder.attachBitmap(bmpImage, 1);
}
function redrawPicture() {
    //first
    replayLineHolder.lineStyle(brushSize(a[0].charAt(0)), a[0].substr(1));
    a.shift();
    replayLineHolder.moveTo(a[0], a[1]);
    a.shift();
    a.shift();
    //second...
    this.onEnterFrame = function() {
        if (a.length != 0) {
            if (a[0].charAt(0) == "B" || a[0].charAt(0) == "N" || a[0].charAt(0) == "S") {
                replayBmpImage.draw(replayLineHolder);
                replayBmpHolder.attachBitmap(replayBmpImage, 1);
                replayLineHolder.clear();
                replayLineHolder.lineStyle(brushSize(a[0].charAt(0)), a[0].substr(1));
                a.shift();
                replayLineHolder.moveTo(a[0], a[1]);
            }
            replayLineHolder.lineTo(a[0], a[1]);
            a.shift();
            a.shift();
        } else {
            //finish
            replayBmpImage.draw(replayLineHolder);
            replayBmpHolder.attachBitmap(replayBmpImage, 1);
            replayLineHolder.clear();
            delete this.onEnterFrame;
        }
    };
}
//BTN-------------------------------
btn_play.onRelease = function() {
    bmpImage = new BitmapData(board._width, board._height, true, 0x000000);
    bmpHolder.attachBitmap(bmpImage, 1);
    redrawPicture();
};
btn_reset.onRelease = function() {
    bmpImage = new BitmapData(board._width, board._height, true, 0x000000);
    bmpHolder.attachBitmap(bmpImage, 1);
    replayBmpImage = new BitmapData(board._width, board._height, true, 0x000000);
    replayBmpHolder.attachBitmap(replayBmpImage, 1);
    a = new Array();
};
//BRUSH-----------------------------
//color
for (var i:Number = 1; i<=12; i++) {
    pallet["colorChip"+i].onRelease = function() {
        var col = new Color(this);
        lineColor = col.getRGB();
        this._parent.select._x = this._x;
        this._parent.select._y = this._y;
    };
}
//thickness
pallet.thick_B.onRelease = function() {
    lineWidth = "B";
    this._parent.selectBrush._x = this._x;
};
pallet.thick_N.onRelease = function() {
    lineWidth = "N";
    this._parent.selectBrush._x = this._x;
};
pallet.thick_S.onRelease = function() {
    lineWidth = "S";
    this._parent.selectBrush._x = this._x;
};
function brushSize(thick:String):Number {
    if (thick == "B") {
        return 10;
    } else if (thick == "N") {
        return 5;
    } else if (thick == "S") {
        return 2;
    }
}

もっと効率のいい＆軽いコーディングを教えてやってもいいという方、コメントいただけると嬉しいです。最高に軽いペンツールってどういうやり方があるのでしょうか？

関連記事：
「trick7.com blog: Flashで筆順再生」
「trick7.com blog: Flashで筆順再生２：色とブラシサイズ」