Free songs
logo

Blog Post

2월
21
2014

Flash에서 가볍고 빠른 드로잉 툴 만들기 (AS 3.0)

flash를 이용해 작업하다 보면 특히 방명록에서 터치 스크린으로 글을 남기거나 할 경우 이전에는 단순히 as3에 있는 draw api를 사용해서 만들었습니다.

function boardMove(e:MouseEvent):void
{

	var curX:Number = mouseX;
	var curY:Number = mouseY;

	if (doDraw)
	{
		pic_temp.graphics.lineTo(curX,curY);
		e.updateAfterEvent();
	}

}

그런데 이경우 vector방식으로 선을 그리고 하다보면 많이 그리게 되면 속도가 현저히 떨어지는 문제가 나왔습니다. 그래서 구글링해보니 bitmapdata를 이용하면 속도가 현저히 상승함을 알게 되었습니다.

주요한 알고리즘은 MouseDown일 때까지는 기존의 방식을 사용하여 그리고 MouseUp할 때 draw를 이용해 bitmap으로 바꿔줘서 속도를 향상시킨다는 알고리즘입니다. 물론 Vector니 DrawPath도 속도향상에 조금 영향을 줍니다.

var cmd:Vector.<int > ;
var coords:Vector.<Number > ;
var _thickness:Number = 5,_col:Number = 0,_alpha:Number = 1;
var bitmap:BitmapData = new BitmapData(stage.stageWidth,stage.stageHeight,true,0x00000000);
var bm:Bitmap = new Bitmap(bitmap);
bm.smoothing = true;
addChild(bm);
var container:Shape = new Shape();

addChild(container);

stage.addEventListener(MouseEvent.MOUSE_DOWN, mouseHandler);
stage.addEventListener(MouseEvent.MOUSE_UP, mouseHandler);

function mouseHandler(e:MouseEvent):void
{

	if (e.type == "mouseDown")
	{

		_thickness = 5;
		_col = 0x000000;
		_alpha = 1;

		cmd = new Vector.<int >   ;
		coords = new Vector.<Number >   ;

		cmd[0] = 1;
		coords[0] = mouseX;
		coords[1] = mouseY;

		stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseHandler);
	}
	else if (e.type == "mouseUp")
	{

		cmd = null;
		coords = null;
		bitmap.draw( container,null,null,null,null,true );
		stage.removeEventListener(MouseEvent.MOUSE_MOVE, mouseHandler);
	}
	else if (e.type == "mouseMove")
	{

		cmd.push(2);

		coords.push(mouseX);

		coords.push(mouseY);

		redraw();

	}
}

function redraw():void
{

	container.graphics.clear();

	container.graphics.lineStyle(_thickness, _col, _alpha,true, LineScaleMode.NORMAL,CapsStyle.ROUND, JointStyle.ROUND, 4);

	container.graphics.drawPath(cmd, coords);

}
COMMENT : 0
About the Author
it에 관한 이런 저런 관심이 많은 주인장입니다.

댓글 남기기