AS3用のGraffitiというライブラリが便利そうなので、試してみました。
UI用にMinimalCompsと画像保存用にas3corelibを使ったとはいえ、100行未満のコードでここまで作れるのは非常に魅力的です。内部処理を詳細には見ていないので作りこむ時には過不足が出てくることもありえますが、少なくとも「とりあえず簡単なお絵かき機能がほしい」という時には重宝しそうです。
ここでは、デモ用に基本的な機能のみを実装しましたが、他にも機能があります。また、マルチタッチデバイス向けの開発も進めているようです。
詳しくは配布サイトをご覧ください。
Graffiti – ActionScript 3 Bitmap Drawing Library
http://www.nocircleno.com/graffiti/
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 |
package { import com.adobe.images.PNGEncoder; import com.bit101.components.*; import com.nocircleno.graffiti.GraffitiCanvas; import com.nocircleno.graffiti.tools.BrushTool; import com.nocircleno.graffiti.tools.BrushType; import com.nocircleno.graffiti.tools.FillBucketTool; import com.nocircleno.graffiti.tools.ToolMode; import flash.display.BitmapData; import flash.display.Sprite; import flash.events.Event; import flash.net.FileReference; [SWF(width = 465, height = 465, backgroundColor = 0xFFFFEA, frameRate = 30)] public class Main extends Sprite { private var _brushTool:BrushTool = new BrushTool(8, 0xFF9900, 1, 0); private var _graffitiCanvas:GraffitiCanvas = new GraffitiCanvas(465, 465, 10); private var _fillBucketTooll:FillBucketTool = new FillBucketTool(0xFF9900); public function Main():void { // Graffitiの設定 addChild(_graffitiCanvas); _graffitiCanvas.activeTool = _brushTool; // UI周りの配置 new Label(this, 10, 0, "Brush Color"); new ColorChooser(this, 10, 16, 0xFF9900, onColorChange); new RadioButton(this, 100, 16, "Pen", true, onPen); new RadioButton(this, 150, 16, "Erase", false, onErase); new RadioButton(this, 200, 16, "Bucket", false, onBucket); new PushButton(this, 260, 8, "Save", onSave).width = 50; new PushButton(this, 340, 4, "undo", onUndo).width = 50; new PushButton(this, 400, 4, "redo", onRedo).width = 50; new Label(this, 10, 34, "Brush Size"); new HSlider(this, 10, 50, onBrushSize).value = 8; new Label(this, 120, 34, "Brush Alpha"); new HSlider(this, 120, 50, onBrushAlpha).value = 100; new Label(this, 230, 34, "Brush Blur"); new HSlider(this, 230, 50, onBrushBlur).value = 0; new Label(this, 340, 24, "Brush Shapes"); var comboBox:ComboBox = new ComboBox(this, 340, 40, "BrushType", [BrushType.BACKWARD_LINE, BrushType.DIAMOND, BrushType.FORWARD_LINE, BrushType.HORIZONTAL_LINE, BrushType.ROUND, BrushType.SQUARE, BrushType.VERTICAL_LINE] ); comboBox.selectedIndex = 5; comboBox.addEventListener(Event.SELECT, box_select); } private function onPen(event:Event):void { _brushTool.mode = ToolMode.NORMAL; _graffitiCanvas.activeTool = _brushTool; } private function onErase(event:Event):void { _brushTool.mode = ToolMode.ERASE; _graffitiCanvas.activeTool = _brushTool; } private function onBucket(event:Event):void { _graffitiCanvas.activeTool = _fillBucketTooll; } private function onSave(event:Event):void { var bitmapData:BitmapData = _graffitiCanvas.drawing(); new FileReference().save(PNGEncoder.encode(bitmapData), "GraffitiDemo.png"); } private function onUndo(event:Event):void { _graffitiCanvas.prevHistory(); } private function onRedo(event:Event):void { _graffitiCanvas.nextHistory(); } private function onBrushSize(event:Event):void { _brushTool.size = (event.target as HSlider).value; } private function onBrushAlpha(event:Event):void { _brushTool.alpha = ((event.target as HSlider).value) * 0.01; } private function onBrushBlur(event:Event):void { _brushTool.blur = ((event.target as HSlider).value) * 0.2; } private function box_select(event:Event):void { _brushTool.type = String((event.target as ComboBox).selectedItem); } private function onColorChange(event:Event):void { _brushTool.color = (event.target as ColorChooser).value; _fillBucketTooll.fillColor = _brushTool.color; } } } |
