notice: Flash editor updated! Join the development! Thanks to MiniBuilder


forked from : y_tti's てらこ23で発表したものの説明２ [diff(151)]

embed

noswf download fullscreen
flash swf thumbnail play
download fullscreen
FORKED
>sort

forked from: てらこ23で発表したものの説明２ forked from: forked from: てらこ23で発表したものの説明２ [diff(20)]

  1. // forked from fumix's forked from: てらこ23で発表したものの説明２
  2. // forked from y_tti's てらこ23で発表したものの説明２
  3. /*
  4. マトリックスを使って台形な変形
  5. ４点のポイントを用意して、その位置を元に変形。
  6. 台形といっても三角形が２つ合体させてます。
  7. だらだら長いソースになってしまったけど、
  8. _draw
  9. _getTransformMatrix
  10. の部分が重要なんで、他は無視無視無視無視無視無視無視無視！！
  12. 格子状にしたら面白いんじゃないかとやってみた。
  13. 分割した矩形の１個目の描画部分が良く分からず・・・。
  14. わざわざ、bitmapDataを別に用意して、矩形にコピーしてそれを変形させて_canvasに再描画しているが
  15. ２個目の分割した矩形はそんなことをせず、直接_canvasに変形させて描画しても問題ない。
  16. １個目は直接変形させて描画すると、順番がめちゃめちゃになる。
  17. テスト用画像を使ってみるとよく分かる。
  18. 出来そうで出来ないのが悔しい
  19. */
  20. package
  21. {
  22.     import flash.display.Bitmap;
  23.     import flash.display.BitmapData;
  24.     import flash.display.Loader;
  25.     import flash.display.Sprite;
  26.     import flash.events.Event;
  27.     import flash.events.MouseEvent;
  28.     import flash.geom.Matrix;
  29.     import flash.geom.Point;
  30.     import flash.net.URLRequest;
  31.     import flash.system.LoaderContext;
  32.     
  33.     import net.hires.debug.Stats;
  34.     
  35.     [SWF(width = "465", height = "465", frameRate = "30", backgroundColor = "0x000000")]
  36.     public class box extends Sprite
  37.     {
  38.         private var _container:Sprite;
  39.         private var _canvas:Sprite;
  40.         private var _bmd:BitmapData;
  41.         private var _stageW:Number = 465;
  42.         private var _stageH:Number = 465;
  43.         private var _w:Number;
  44.         private var _cP0:CirclePoint;
  45.         private var _cP1:CirclePoint;
  46.         private var _cP2:CirclePoint;
  47.         private var _cP3:CirclePoint;
  48.         private var _matrixArray:Array;
  49.                 private var _divide:int = 2;
  50.                 private var _canvasSize:int = 350;
  52.         //格子のどこに画像が描画されているかを見るためのテスト用画像
  53.         private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/base.jpg";        
  54.         
  55.         //private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/kuri.jpg";        
  56.         
  57.         public function box()
  58.         {
  59.             if (stage) init();
  60.             else addEventListener(Event.ADDED_TO_STAGE, init);
  61.         }
  62.         
  63.         private function init(e:Event = null):void 
  64.         {
  65.             removeEventListener(Event.ADDED_TO_STAGE, init);
  66.             //画像の読み込み
  67.             var req:URLRequest = new URLRequest(IMAGE_URL);
  68.             var loader:Loader = new Loader();
  69.             loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);    
  70.             loader.load( req, new LoaderContext(true));
  71.             // take a capture after 10 sec
  72.             //Wonderfl.capture_delay( 120 );
  73.         }
  74.         
  75.         //画像読み込み後の処理
  76.         private function loadComplete(e:Event):void 
  77.         {
  78.             e.target.removeEventListener(Event.COMPLETE, loadComplete);
  79.         
  80.             //取得した画像を切り取って_bmdに入れる
  81.             _bmd = new BitmapData (_canvasSize, _canvasSize, true, 0xFFFFFF);
  82.             _bmd.draw (e.target.loader.content.bitmapData);
  83.             
  84.             //キャンバスを用意してコンテナに入れる(重要じゃないので無視無視)
  85.             _canvas = new Sprite();
  86.             _container = new Sprite();
  87.             _container.addChild(_canvas);
  88.             addChild(_container);
  89.             _container.x = (_stageW - _bmd.width)/2;
  90.             _container.y = (_stageH - _bmd.height)/2;
  91.             
  92.             //画像の大きさに合わせ、ポイントを5ｘ5の格子に配置する(配列に入れる）
  93.             //CirclePointのコンストラクタの中で初期状態のポイント位置を保持してます。（initPoint）
  94.             //その初期ポイントと、マウスドラッグで移動したポイントを比較してるのが、_drawの中。
  95.             _w = _bmd.width / _divide;
  97.             _matrixArray = new Array ();
  98.             //x軸とy軸の2重ループ(配列に入れる
  99.             for (var j:int = 0; j <= _bmd.width; j += _w) {
  100.                 for (var i:int = 0; i <= _bmd.height; i += _w) {
  101.                     var cp:CirclePoint = new CirclePoint (i, j);
  102.                     trace ('cp'+i+':' + cp.initPoint);
  103.                     _matrixArray.push (cp);
  104.                     //ポイントのドラッグとかの設定
  105.                     //※ドラッグした時に_drawを呼び出してます。
  106.                     cp.addEventListener(MouseEvent.MOUSE_DOWN , _cPMouseDownHandler );
  107.                     _container.addChild (cp);
  108.                 }
  109.             }
  110.             _draw();
  111.             
  112.             //速度とかメモリとかチェック(重要じゃないので無視無視)
  113.             //addChild(new Stats());
  114.         }
  115.         
  116.         private function _draw():void {
  117.             /**
  118.              * ポイントの番号は↓な感じ。
  119.              *   0--------1
  120.              *   ----------
  121.              *   ----------
  122.              *   2--------3
  123.              */            
  124.             //マトリックスを適応
  125.             _canvas.graphics.clear();
  127.             //配列のループ
  128.             for (var k:String in _matrixArray) {
  129.                 //
  130.                 if (int(k) > (_divide*_divide+_divide-1)) break;
  131.                 if ((int (k) + 1) % (_divide+1) == 0) continue;
  132.                 //初期状態のポイント取得
  133.                 _cP0 = _matrixArray[int (k)];
  134.                 _cP1 = _matrixArray[int (k) + 1];
  135.                 _cP2 = _matrixArray[int (k) + _divide+1];
  136.                 _cP3 = _matrixArray[int (k) + _divide+2];
  137.                 
  138.                 var aP0:Point = _cP0.initPoint;
  139.                 var aP1:Point = _cP1.initPoint;
  140.                 var aP2:Point = _cP2.initPoint;
  141.                 var aP3:Point = _cP3.initPoint;
  143.                 //初期状態のポイントよりマトリックス取得
  144.                 var initMatrix1:Matrix = _getTransformMatrix( aP0 , aP1 , aP2 );
  145.                 var initMatrix2:Matrix = _getTransformMatrix( aP3 , aP2 , aP1 );
  146.                 //変更状態のポイント取得
  147.                 var bP0:Point = new Point(_cP0.x , _cP0.y );
  148.                 var bP1:Point = new Point(_cP1.x , _cP1.y );
  149.                 var bP2:Point = new Point(_cP2.x , _cP2.y );
  150.                 var bP3:Point = new Point (_cP3.x , _cP3.y );
  151.                 //変更状態のポイントよりマトリックス取得
  152.                 var editMatrix1:Matrix = _getTransformMatrix( bP0 , bP1 , bP2 );
  153.                 var editMatrix2:Matrix = _getTransformMatrix( bP3 , bP2 , bP1 );
  154.                 //初期状態と変更状態のマトリックスを合体
  155.                 var newMatrix1:Matrix = initMatrix1.clone();
  156.                 newMatrix1.concat(editMatrix1);
  157.                 var newMatrix2:Matrix = initMatrix2.clone();
  158.                 newMatrix2.concat(editMatrix2);
  159.                 
  160.                 //（無理やり）分割した１個目の描写のロジック
  161.                 //２個目はわざわざ、別のbitmapDataを用意しなくても直接描画できる。
  162.                 //１個目は別のbitmapDataを用意ないと順番がめちゃくちゃになる。
  163.                 var matBmd:BitmapData = new BitmapData (_canvasSize/_divide, _canvasSize/_divide, true);
  164.                 var mat:Matrix = new Matrix ();
  165.                 mat.tx = - aP0.x;
  166.                 mat.ty = - aP0.y;
  167.                 matBmd.draw (_bmd, mat);
  169.                 //分割した１個目を描画
  170.                 _canvas.graphics.lineStyle(0 , 0x000000, 0);
  171.                 _canvas.graphics.beginBitmapFill(matBmd , newMatrix1 );
  172.                 _canvas.graphics.moveTo(bP0.x , bP0.y );
  173.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  174.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  175.                 _canvas.graphics.endFill ();
  176.                 
  177.                 //分割した２個目を描画
  178.                 _canvas.graphics.lineStyle(0 , 0x000000, 0);
  179.                 _canvas.graphics.beginBitmapFill(_bmd , newMatrix2 );
  180.                 _canvas.graphics.moveTo(bP3.x , bP3.y );
  181.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  182.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  183.                 _canvas.graphics.endFill();
  184.             }            
  185.         }
  186.         
  187.         
  188.         private function _getTransformMatrix($pt0:Point, $pt1:Point, $pt2:Point):Matrix
  189.         {
  190.             /*
  191.             http://www.adobe.com/jp/devnet/flash/articles/matrix_class.html
  192.             a: 水平方向の伸縮率 = 変換後の幅/もとの幅
  193.             b: 垂直方向の傾斜率 = 垂直方向の傾斜/もとの幅
  194.             c: 水平方向の傾斜率 = 水平方向の傾斜/もとの高さ
  195.             d: 垂直方向の伸縮率 = 変換後の高さ/もとの高さ
  196.             tx: 水平方向の移動ピクセル数
  197.             ty: 垂直方向の移動ピクセル数
  198.             */
  199.             var w:Number = _w;
  200.             var h:Number = _w;
  201.             var mat:Matrix = new Matrix();
  202.             mat.a = Number(($pt1.x - $pt0.x) / w);
  203.             mat.b = Number(($pt1.y - $pt0.y) / w);
  204.             mat.c = Number(($pt2.x - $pt0.x) / h);
  205.             mat.d = Number(($pt2.y - $pt0.y) / h);
  206.             mat.tx = $pt0.x;
  207.             mat.ty = $pt0.y;
  208.             return mat;
  209.         }
  210.         
  211.         //こっからマウスのドラッグとかの設定（無視無視）
  212.         private function _cPMouseDownHandler(e:MouseEvent):void {
  213.             CirclePoint(e.target).startDrag();
  214.             CirclePoint(e.target).addEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  215.             stage.addEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  216.         }
  217.         
  218.         private function _cPMouseUpHandler(e:MouseEvent):void {
  219.             CirclePoint(e.target).stopDrag();
  220.             CirclePoint(e.target).removeEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  221.             stage.removeEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  222.         }
  223.         
  224.         private function _cPMouseMoveHandler(e:MouseEvent):void {
  225.             _draw();
  226.         }
  227.         
  228.         
  230.     }
  231. }
  234. import flash.display.Bitmap;
  235. import flash.display.Shape;
  236. import flash.display.BitmapData;
  237. import flash.display.Sprite;
  238. import flash.geom.Point;
  240. /**
  241.  * 赤い点を書いてる。
  242.  * それと初期状態のポイントをinitPointに保持してる。
  243.  */
  244. class CirclePoint extends Sprite {
  245.     public var initPoint:Point;
  246.     public function CirclePoint($x:Number , $y:Number) {
  247.         this.x = $x;
  248.         this.y = $y;
  249.         this.initPoint = new Point( $x , $y );
  250.         this.graphics.beginFill(0xFF0000,1);
  251.         this.graphics.drawCircle(0,0,2);
  252.         this.graphics.endFill();
  253.         this.buttonMode = true;
  254.     }
  255. }
  257. /**
  258.  * このTestImageクラスは画像の代わりに無理矢理、
  259.  * BitmapDataを作成してるだけなので無視無視無視無視無視。
  260.  */
  261. class TestImage extends Bitmap {
  262.     private var _w:Number = 200;
  263.     private var _h:Number = 200;
  264.     public function TestImage():void {
  265.         var s:Shape = new Shape();
  266.         s.graphics.beginFill(0xCCCCCC , 1 );
  267.         s.graphics.drawRect(0,0,_w,_h);
  268.         s.graphics.beginFill(0xFCFCFC , 1 );
  269.         s.graphics.drawRoundRect(30 , 30 , 30 , 10 , 20 ,20);
  270.         s.graphics.drawRoundRect(140 , 30 , 30 , 10 , 20 ,20);
  271.         s.graphics.drawCircle(50,70,10);
  272.         s.graphics.drawCircle(150,70,10);
  273.         s.graphics.drawCircle(75,120,5);
  274.         s.graphics.drawCircle(125,120,5);
  275.         s.graphics.drawRoundRect(40 , 170 , 120 , 10 , 20 ,20);
  276.         s.graphics.endFill();
  277.         
  278.         var bmd:BitmapData = new BitmapData(_w,_h);
  279.         bmd.draw(s);
  280.         this.bitmapData = bmd;
  281.     }
  282. }
noswf

forked from: てらこ23で発表したものの説明２ forked from: forked from: てらこ23で発表したものの説明２ [diff(1)]

  1. // forked from fumix's forked from: てらこ23で発表したものの説明２
  2. // forked from y_tti's てらこ23で発表したものの説明２
  3. /*
  4. マトリックスを使って台形な変形
  5. ４点のポイントを用意して、その位置を元に変形。
  6. 台形といっても三角形が２つ合体させてます。
  7. だらだら長いソースになってしまったけど、
  8. _draw
  9. _getTransformMatrix
  10. の部分が重要なんで、他は無視無視無視無視無視無視無視無視！！
  12. 格子状にしたら面白いんじゃないかとやってみた。
  13. 分割した矩形の１個目の描画部分が良く分からず・・・。
  14. わざわざ、bitmapDataを別に用意して、矩形にコピーしてそれを変形させて_canvasに再描画しているが
  15. ２個目の分割した矩形はそんなことをせず、直接_canvasに変形させて描画しても問題ない。
  16. １個目は直接変形させて描画すると、順番がめちゃめちゃになる。
  17. テスト用画像を使ってみるとよく分かる。
  18. 出来そうで出来ないのが悔しい
  19. */
  20. package
  21. {
  22.     import flash.display.Bitmap;
  23.     import flash.display.BitmapData;
  24.     import flash.display.Loader;
  25.     import flash.display.Sprite;
  26.     import flash.events.Event;
  27.     import flash.events.MouseEvent;
  28.     import flash.geom.Matrix;
  29.     import flash.geom.Point;
  30.     import flash.net.URLRequest;
  31.     import flash.system.LoaderContext;
  32.     
  33.     import net.hires.debug.Stats;
  34.     
  35.     [SWF(width = "465", height = "465", frameRate = "30", backgroundColor = "0x000000")]
  36.     public class box extends Sprite
  37.     {
  38.         private var _container:Sprite;
  39.         private var _canvas:Sprite;
  40.         private var _bmd:BitmapData;
  41.         private var _stageW:Number = 465;
  42.         private var _stageH:Number = 465;
  43.         private var _w:Number;
  44.         private var _cP0:CirclePoint;
  45.         private var _cP1:CirclePoint;
  46.         private var _cP2:CirclePoint;
  47.         private var _cP3:CirclePoint;
  48.         private var _matrixArray:Array;
  50.         //格子のどこに画像が描画されているかを見るためのテスト用画像
  51.         //private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/base.jpg";        
  52.         
  53.         private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/kuri.jpg";        
  54.         
  55.         public function box()
  56.         {
  57.             if (stage) init();
  58.             else addEventListener(Event.ADDED_TO_STAGE, init);
  59.         }
  60.         
  61.         private function init(e:Event = null):void 
  62.         {
  63.             removeEventListener(Event.ADDED_TO_STAGE, init);
  64.             //画像の読み込み
  65.             var req:URLRequest = new URLRequest(IMAGE_URL);
  66.             var loader:Loader = new Loader();
  67.             loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);    
  68.             loader.load( req, new LoaderContext(true));
  69.             // take a capture after 10 sec
  70.             //Wonderfl.capture_delay( 120 );
  71.         }
  72.         
  73.         //画像読み込み後の処理
  74.         private function loadComplete(e:Event):void 
  75.         {
  76.             e.target.removeEventListener(Event.COMPLETE, loadComplete);
  77.         
  78.             //取得した画像を切り取って_bmdに入れる
  79.             _bmd = new BitmapData (350, 350, true, 0xFFFFFF);
  80.             _bmd.draw (e.target.loader.content.bitmapData);
  81.             
  82.             //キャンバスを用意してコンテナに入れる(重要じゃないので無視無視)
  83.             _canvas = new Sprite();
  84.             _container = new Sprite();
  85.             _container.addChild(_canvas);
  86.             addChild(_container);
  87.             _container.x = (_stageW - _bmd.width)/2;
  88.             _container.y = (_stageH - _bmd.height)/2;
  89.             
  90.             //画像の大きさに合わせ、ポイントを5ｘ5の格子に配置する(配列に入れる）
  91.             //CirclePointのコンストラクタの中で初期状態のポイント位置を保持してます。（initPoint）
  92.             //その初期ポイントと、マウスドラッグで移動したポイントを比較してるのが、_drawの中。
  93.             _w = _bmd.width / 5;
  95.             _matrixArray = new Array ();
  96.             //x軸とy軸の2重ループ(配列に入れる
  97.             for (var j:int = 0; j <= _bmd.width; j += _w) {
  98.                 for (var i:int = 0; i <= _bmd.height; i += _w) {
  99.                     var cp:CirclePoint = new CirclePoint (i, j);
  100.                     trace ('cp'+i+':' + cp.initPoint);
  101.                     _matrixArray.push (cp);
  102.                     //ポイントのドラッグとかの設定
  103.                     //※ドラッグした時に_drawを呼び出してます。
  104.                     cp.addEventListener(MouseEvent.MOUSE_DOWN , _cPMouseDownHandler );
  105.                     _container.addChild (cp);
  106.                 }
  107.             }
  108.             _draw();
  109.             
  110.             //速度とかメモリとかチェック(重要じゃないので無視無視)
  111.             addChild(new Stats());
  112.         }
  113.         
  114.         private function _draw():void {
  115.             /**
  116.              * ポイントの番号は↓な感じ。
  117.              *   0--------1
  118.              *   ----------
  119.              *   ----------
  120.              *   2--------3
  121.              */            
  122.             //マトリックスを適応
  123.             _canvas.graphics.clear();
  125.             //配列のループ
  126.             for (var k:String in _matrixArray) {
  127.                 //
  128.                 if (int(k) > 29) break;
  129.                 if ((int (k) + 1) % 6 == 0) continue;
  130.                 //初期状態のポイント取得
  131.                 _cP0 = _matrixArray[int (k)];
  132.                 _cP1 = _matrixArray[int (k) + 1];
  133.                 _cP2 = _matrixArray[int (k) + 6];
  134.                 _cP3 = _matrixArray[int (k) + 7];
  135.                 
  136.                 var aP0:Point = _cP0.initPoint;
  137.                 var aP1:Point = _cP1.initPoint;
  138.                 var aP2:Point = _cP2.initPoint;
  139.                 var aP3:Point = _cP3.initPoint;
  141.                 //初期状態のポイントよりマトリックス取得
  142.                 var initMatrix1:Matrix = _getTransformMatrix( aP0 , aP1 , aP2 );
  143.                 var initMatrix2:Matrix = _getTransformMatrix( aP3 , aP2 , aP1 );
  144.                 //変更状態のポイント取得
  145.                 var bP0:Point = new Point(_cP0.x , _cP0.y );
  146.                 var bP1:Point = new Point(_cP1.x , _cP1.y );
  147.                 var bP2:Point = new Point(_cP2.x , _cP2.y );
  148.                 var bP3:Point = new Point (_cP3.x , _cP3.y );
  149.                 //変更状態のポイントよりマトリックス取得
  150.                 var editMatrix1:Matrix = _getTransformMatrix( bP0 , bP1 , bP2 );
  151.                 var editMatrix2:Matrix = _getTransformMatrix( bP3 , bP2 , bP1 );
  152.                 //初期状態と変更状態のマトリックスを合体
  153.                 var newMatrix1:Matrix = initMatrix1.clone();
  154.                 newMatrix1.concat(editMatrix1);
  155.                 var newMatrix2:Matrix = initMatrix2.clone();
  156.                 newMatrix2.concat(editMatrix2);
  157.                 
  158.                 //（無理やり）分割した１個目の描写のロジック
  159.                 //２個目はわざわざ、別のbitmapDataを用意しなくても直接描画できる。
  160.                 //１個目は別のbitmapDataを用意ないと順番がめちゃくちゃになる。
  161.                 var matBmd:BitmapData = new BitmapData (70, 70, true);
  162.                 var mat:Matrix = new Matrix ();
  163.                 mat.tx = - aP0.x;
  164.                 mat.ty = - aP0.y;
  165.                 matBmd.draw (_bmd, mat);
  167.                 //分割した１個目を描画
  168.                 _canvas.graphics.lineStyle(1 , 0x00FF00);
  169.                 _canvas.graphics.beginBitmapFill(matBmd , newMatrix1 );
  170.                 _canvas.graphics.moveTo(bP0.x , bP0.y );
  171.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  172.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  173.                 _canvas.graphics.endFill ();
  174.                 
  175.                 //分割した２個目を描画
  176.                 _canvas.graphics.lineStyle(1 , 0x00FF00);
  177.                 _canvas.graphics.beginBitmapFill(_bmd , newMatrix2 );
  178.                 _canvas.graphics.moveTo(bP3.x , bP3.y );
  179.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  180.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  181.                 _canvas.graphics.endFill();
  182.             }            
  183.         }
  184.         
  185.         
  186.         private function _getTransformMatrix($pt0:Point, $pt1:Point, $pt2:Point):Matrix
  187.         {
  188.             /*
  189.             http://www.adobe.com/jp/devnet/flash/articles/matrix_class.html
  190.             a: 水平方向の伸縮率 = 変換後の幅/もとの幅
  191.             b: 垂直方向の傾斜率 = 垂直方向の傾斜/もとの幅
  192.             c: 水平方向の傾斜率 = 水平方向の傾斜/もとの高さ
  193.             d: 垂直方向の伸縮率 = 変換後の高さ/もとの高さ
  194.             tx: 水平方向の移動ピクセル数
  195.             ty: 垂直方向の移動ピクセル数
  196.             */
  197.             var w:Number = _w;
  198.             var h:Number = _w;
  199.             var mat:Matrix = new Matrix();
  200.             mat.a = ($pt1.x - $pt0.x) / w;
  201.             mat.b = ($pt1.y - $pt0.y) / w;
  202.             mat.c = ($pt2.x - $pt0.x) / h;
  203.             mat.d = ($pt2.y - $pt0.y) / h;
  204.             mat.tx = $pt0.x;
  205.             mat.ty = $pt0.y;
  206.             return mat;
  207.         }
  208.         
  209.         //こっからマウスのドラッグとかの設定（無視無視）
  210.         private function _cPMouseDownHandler(e:MouseEvent):void {
  211.             CirclePoint(e.target).startDrag();
  212.             CirclePoint(e.target).addEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  213.             stage.addEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  214.         }
  215.         
  216.         private function _cPMouseUpHandler(e:MouseEvent):void {
  217.             CirclePoint(e.target).stopDrag();
  218.             CirclePoint(e.target).removeEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  219.             stage.removeEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  220.         }
  221.         
  222.         private function _cPMouseMoveHandler(e:MouseEvent):void {
  223.             _draw();
  224.         }
  225.         
  226.         
  228.     }
  229. }
  232. import flash.display.Bitmap;
  233. import flash.display.Shape;
  234. import flash.display.BitmapData;
  235. import flash.display.Sprite;
  236. import flash.geom.Point;
  238. /**
  239.  * 赤い点を書いてる。
  240.  * それと初期状態のポイントをinitPointに保持してる。
  241.  */
  242. class CirclePoint extends Sprite {
  243.     public var initPoint:Point;
  244.     public function CirclePoint($x:Number , $y:Number) {
  245.         this.x = $x;
  246.         this.y = $y;
  247.         this.initPoint = new Point( $x , $y );
  248.         this.graphics.beginFill(0xFF0000,1);
  249.         this.graphics.drawCircle(0,0,5);
  250.         this.graphics.endFill();
  251.         this.buttonMode = true;
  252.     }
  253. }
  255. /**
  256.  * このTestImageクラスは画像の代わりに無理矢理、
  257.  * BitmapDataを作成してるだけなので無視無視無視無視無視。
  258.  */
  259. class TestImage extends Bitmap {
  260.     private var _w:Number = 200;
  261.     private var _h:Number = 200;
  262.     public function TestImage():void {
  263.         var s:Shape = new Shape();
  264.         s.graphics.beginFill(0xCCCCCC , 1 );
  265.         s.graphics.drawRect(0,0,_w,_h);
  266.         s.graphics.beginFill(0xFCFCFC , 1 );
  267.         s.graphics.drawRoundRect(30 , 30 , 30 , 10 , 20 ,20);
  268.         s.graphics.drawRoundRect(140 , 30 , 30 , 10 , 20 ,20);
  269.         s.graphics.drawCircle(50,70,10);
  270.         s.graphics.drawCircle(150,70,10);
  271.         s.graphics.drawCircle(75,120,5);
  272.         s.graphics.drawCircle(125,120,5);
  273.         s.graphics.drawRoundRect(40 , 170 , 120 , 10 , 20 ,20);
  274.         s.graphics.endFill();
  275.         
  276.         var bmd:BitmapData = new BitmapData(_w,_h);
  277.         bmd.draw(s);
  278.         this.bitmapData = bmd;
  279.     }
  280. }
noswf

forked from: てらこ23で発表したものの説明２ forked from: forked from: てらこ23で発表したものの説明２ [diff(1)]

  1. // forked from fumix's forked from: てらこ23で発表したものの説明２
  2. // forked from y_tti's てらこ23で発表したものの説明２
  3. /*
  4. マトリックスを使って台形な変形
  5. ４点のポイントを用意して、その位置を元に変形。
  6. 台形といっても三角形が２つ合体させてます。
  7. だらだら長いソースになってしまったけど、
  8. _draw
  9. _getTransformMatrix
  10. の部分が重要なんで、他は無視無視無視無視無視無視無視無視！！
  12. 格子状にしたら面白いんじゃないかとやってみた。
  13. 分割した矩形の１個目の描画部分が良く分からず・・・。
  14. わざわざ、bitmapDataを別に用意して、矩形にコピーしてそれを変形させて_canvasに再描画しているが
  15. ２個目の分割した矩形はそんなことをせず、直接_canvasに変形させて描画しても問題ない。
  16. １個目は直接変形させて描画すると、順番がめちゃめちゃになる。
  17. テスト用画像を使ってみるとよく分かる。
  18. 出来そうで出来ないのが悔しい
  19. */
  20. package
  21. {
  22.     import flash.display.Bitmap;
  23.     import flash.display.BitmapData;
  24.     import flash.display.Loader;
  25.     import flash.display.Sprite;
  26.     import flash.events.Event;
  27.     import flash.events.MouseEvent;
  28.     import flash.geom.Matrix;
  29.     import flash.geom.Point;
  30.     import flash.net.URLRequest;
  31.     import flash.system.LoaderContext;
  32.     
  33.     import net.hires.debug.Stats;
  34.     
  35.     [SWF(width = "465", height = "465", frameRate = "30", backgroundColor = "0x000000")]
  36.     public class box extends Sprite
  37.     {
  38.         private var _container:Sprite;
  39.         private var _canvas:Sprite;
  40.         private var _bmd:BitmapData;
  41.         private var _stageW:Number = 465;
  42.         private var _stageH:Number = 465;
  43.         private var _w:Number;
  44.         private var _cP0:CirclePoint;
  45.         private var _cP1:CirclePoint;
  46.         private var _cP2:CirclePoint;
  47.         private var _cP3:CirclePoint;
  48.         private var _matrixArray:Array;
  50.         //格子のどこに画像が描画されているかを見るためのテスト用画像
  51.         //private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/base.jpg";        
  52.         
  53.         private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/kuri.jpg";        
  54.         
  55.         public function box()
  56.         {
  57.             if (stage) init();
  58.             else addEventListener(Event.ADDED_TO_STAGE, init);
  59.         }
  60.         
  61.         private function init(e:Event = null):void 
  62.         {
  63.             removeEventListener(Event.ADDED_TO_STAGE, init);
  64.             //画像の読み込み
  65.             var req:URLRequest = new URLRequest(IMAGE_URL);
  66.             var loader:Loader = new Loader();
  67.             loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);    
  68.             loader.load( req, new LoaderContext(true));
  69.             // take a capture after 10 sec
  70.             //Wonderfl.capture_delay( 120 );
  71.         }
  72.         
  73.         //画像読み込み後の処理
  74.         private function loadComplete(e:Event):void 
  75.         {
  76.             e.target.removeEventListener(Event.COMPLETE, loadComplete);
  77.         
  78.             //取得した画像を切り取って_bmdに入れる
  79.             _bmd = new BitmapData (350, 350, true, 0xFFFFFF);
  80.             _bmd.draw (e.target.loader.content.bitmapData);
  81.             
  82.             //キャンバスを用意してコンテナに入れる(重要じゃないので無視無視)
  83.             _canvas = new Sprite();
  84.             _container = new Sprite();
  85.             _container.addChild(_canvas);
  86.             addChild(_container);
  87.             _container.x = (_stageW - _bmd.width)/2;
  88.             _container.y = (_stageH - _bmd.height)/2;
  89.             
  90.             //画像の大きさに合わせ、ポイントを5ｘ5の格子に配置する(配列に入れる）
  91.             //CirclePointのコンストラクタの中で初期状態のポイント位置を保持してます。（initPoint）
  92.             //その初期ポイントと、マウスドラッグで移動したポイントを比較してるのが、_drawの中。
  93.             _w = _bmd.width / 5;
  95.             _matrixArray = new Array ();
  96.             //x軸とy軸の2重ループ(配列に入れる
  97.             for (var j:int = 0; j <= _bmd.width; j += _w) {
  98.                 for (var i:int = 0; i <= _bmd.height; i += _w) {
  99.                     var cp:CirclePoint = new CirclePoint (i, j);
  100.                     trace ('cp'+i+':' + cp.initPoint);
  101.                     _matrixArray.push (cp);
  102.                     //ポイントのドラッグとかの設定
  103.                     //※ドラッグした時に_drawを呼び出してます。
  104.                     cp.addEventListener(MouseEvent.MOUSE_DOWN , _cPMouseDownHandler );
  105.                     _container.addChild (cp);
  106.                 }
  107.             }
  108.             _draw();
  109.             
  110.             //速度とかメモリとかチェック(重要じゃないので無視無視)
  111.             addChild(new Stats());
  112.         }
  113.         
  114.         private function _draw():void {
  115.             /**
  116.              * ポイントの番号は↓な感じ。
  117.              *   0--------1
  118.              *   ----------
  119.              *   ----------
  120.              *   2--------3
  121.              */            
  122.             //マトリックスを適応
  123.             _canvas.graphics.clear();
  125.             //配列のループ
  126.             for (var k:String in _matrixArray) {
  127.                 //
  128.                 if (int(k) > 29) break;
  129.                 if ((int (k) + 1) % 6 == 0) continue;
  130.                 //初期状態のポイント取得
  131.                 _cP0 = _matrixArray[int (k)];
  132.                 _cP1 = _matrixArray[int (k) + 1];
  133.                 _cP2 = _matrixArray[int (k) + 6];
  134.                 _cP3 = _matrixArray[int (k) + 7];
  135.                 
  136.                 var aP0:Point = _cP0.initPoint;
  137.                 var aP1:Point = _cP1.initPoint;
  138.                 var aP2:Point = _cP2.initPoint;
  139.                 var aP3:Point = _cP3.initPoint;
  141.                 //初期状態のポイントよりマトリックス取得
  142.                 var initMatrix1:Matrix = _getTransformMatrix( aP0 , aP1 , aP2 );
  143.                 var initMatrix2:Matrix = _getTransformMatrix( aP3 , aP2 , aP1 );
  144.                 //変更状態のポイント取得
  145.                 var bP0:Point = new Point(_cP0.x , _cP0.y );
  146.                 var bP1:Point = new Point(_cP1.x , _cP1.y );
  147.                 var bP2:Point = new Point(_cP2.x , _cP2.y );
  148.                 var bP3:Point = new Point (_cP3.x , _cP3.y );
  149.                 //変更状態のポイントよりマトリックス取得
  150.                 var editMatrix1:Matrix = _getTransformMatrix( bP0 , bP1 , bP2 );
  151.                 var editMatrix2:Matrix = _getTransformMatrix( bP3 , bP2 , bP1 );
  152.                 //初期状態と変更状態のマトリックスを合体
  153.                 var newMatrix1:Matrix = initMatrix1.clone();
  154.                 newMatrix1.concat(editMatrix1);
  155.                 var newMatrix2:Matrix = initMatrix2.clone();
  156.                 newMatrix2.concat(editMatrix2);
  157.                 
  158.                 //（無理やり）分割した１個目の描写のロジック
  159.                 //２個目はわざわざ、別のbitmapDataを用意しなくても直接描画できる。
  160.                 //１個目は別のbitmapDataを用意ないと順番がめちゃくちゃになる。
  161.                 var matBmd:BitmapData = new BitmapData (70, 70, true);
  162.                 var mat:Matrix = new Matrix ();
  163.                 mat.tx = - aP0.x;
  164.                 mat.ty = - aP0.y;
  165.                 matBmd.draw (_bmd, mat);
  167.                 //分割した１個目を描画
  168.                 _canvas.graphics.lineStyle(1 , 0x00FF00);
  169.                 _canvas.graphics.beginBitmapFill(matBmd , newMatrix1 );
  170.                 _canvas.graphics.moveTo(bP0.x , bP0.y );
  171.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  172.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  173.                 _canvas.graphics.endFill ();
  174.                 
  175.                 //分割した２個目を描画
  176.                 _canvas.graphics.lineStyle(1 , 0x00FF00);
  177.                 _canvas.graphics.beginBitmapFill(_bmd , newMatrix2 );
  178.                 _canvas.graphics.moveTo(bP3.x , bP3.y );
  179.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  180.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  181.                 _canvas.graphics.endFill();
  182.             }            
  183.         }
  184.         
  185.         
  186.         private function _getTransformMatrix($pt0:Point, $pt1:Point, $pt2:Point):Matrix
  187.         {
  188.             /*
  189.             http://www.adobe.com/jp/devnet/flash/articles/matrix_class.html
  190.             a: 水平方向の伸縮率 = 変換後の幅/もとの幅
  191.             b: 垂直方向の傾斜率 = 垂直方向の傾斜/もとの幅
  192.             c: 水平方向の傾斜率 = 水平方向の傾斜/もとの高さ
  193.             d: 垂直方向の伸縮率 = 変換後の高さ/もとの高さ
  194.             tx: 水平方向の移動ピクセル数
  195.             ty: 垂直方向の移動ピクセル数
  196.             */
  197.             var w:Number = _w;
  198.             var h:Number = _w;
  199.             var mat:Matrix = new Matrix();
  200.             mat.a = ($pt1.x - $pt0.x) / w;
  201.             mat.b = ($pt1.y - $pt0.y) / w;
  202.             mat.c = ($pt2.x - $pt0.x) / h;
  203.             mat.d = ($pt2.y - $pt0.y) / h;
  204.             mat.tx = $pt0.x;
  205.             mat.ty = $pt0.y;
  206.             return mat;
  207.         }
  208.         
  209.         //こっからマウスのドラッグとかの設定（無視無視）
  210.         private function _cPMouseDownHandler(e:MouseEvent):void {
  211.             CirclePoint(e.target).startDrag();
  212.             CirclePoint(e.target).addEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  213.             stage.addEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  214.         }
  215.         
  216.         private function _cPMouseUpHandler(e:MouseEvent):void {
  217.             CirclePoint(e.target).stopDrag();
  218.             CirclePoint(e.target).removeEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  219.             stage.removeEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  220.         }
  221.         
  222.         private function _cPMouseMoveHandler(e:MouseEvent):void {
  223.             _draw();
  224.         }
  225.         
  226.         
  228.     }
  229. }
  232. import flash.display.Bitmap;
  233. import flash.display.Shape;
  234. import flash.display.BitmapData;
  235. import flash.display.Sprite;
  236. import flash.geom.Point;
  238. /**
  239.  * 赤い点を書いてる。
  240.  * それと初期状態のポイントをinitPointに保持してる。
  241.  */
  242. class CirclePoint extends Sprite {
  243.     public var initPoint:Point;
  244.     public function CirclePoint($x:Number , $y:Number) {
  245.         this.x = $x;
  246.         this.y = $y;
  247.         this.initPoint = new Point( $x , $y );
  248.         this.graphics.beginFill(0xFF0000,1);
  249.         this.graphics.drawCircle(0,0,5);
  250.         this.graphics.endFill();
  251.         this.buttonMode = true;
  252.     }
  253. }
  255. /**
  256.  * このTestImageクラスは画像の代わりに無理矢理、
  257.  * BitmapDataを作成してるだけなので無視無視無視無視無視。
  258.  */
  259. class TestImage extends Bitmap {
  260.     private var _w:Number = 200;
  261.     private var _h:Number = 200;
  262.     public function TestImage():void {
  263.         var s:Shape = new Shape();
  264.         s.graphics.beginFill(0xCCCCCC , 1 );
  265.         s.graphics.drawRect(0,0,_w,_h);
  266.         s.graphics.beginFill(0xFCFCFC , 1 );
  267.         s.graphics.drawRoundRect(30 , 30 , 30 , 10 , 20 ,20);
  268.         s.graphics.drawRoundRect(140 , 30 , 30 , 10 , 20 ,20);
  269.         s.graphics.drawCircle(50,70,10);
  270.         s.graphics.drawCircle(150,70,10);
  271.         s.graphics.drawCircle(75,120,5);
  272.         s.graphics.drawCircle(125,120,5);
  273.         s.graphics.drawRoundRect(40 , 170 , 120 , 10 , 20 ,20);
  274.         s.graphics.endFill();
  275.         
  276.         var bmd:BitmapData = new BitmapData(_w,_h);
  277.         bmd.draw(s);
  278.         this.bitmapData = bmd;
  279.     }
  280. }
noswf

forked from: てらこ23で発表したものの説明２ forked from: forked from: てらこ23で発表したものの説明２ [diff(10)]

  1. // forked from fumix's forked from: てらこ23で発表したものの説明２
  2. // forked from y_tti's てらこ23で発表したものの説明２
  3. /*
  4. マトリックスを使って台形な変形
  5. ４点のポイントを用意して、その位置を元に変形。
  6. 台形といっても三角形が２つ合体させてます。
  7. だらだら長いソースになってしまったけど、
  8. _draw
  9. _getTransformMatrix
  10. の部分が重要なんで、他は無視無視無視無視無視無視無視無視！！
  12. 格子状にしたら面白いんじゃないかとやってみた。
  13. 分割した矩形の１個目の描画部分が良く分からず・・・。
  14. わざわざ、bitmapDataを別に用意して、矩形にコピーしてそれを変形させて_canvasに再描画しているが
  15. ２個目の分割した矩形はそんなことをせず、直接_canvasに変形させて描画しても問題ない。
  16. １個目は直接変形させて描画すると、順番がめちゃめちゃになる。
  17. テスト用画像を使ってみるとよく分かる。
  18. 出来そうで出来ないのが悔しい
  19. ↓
  20. 分割した１個目の矩形を直接_canvas上に描画したらどうなるかのテスト
  23. */
  24. package
  25. {
  26.     import flash.display.Bitmap;
  27.     import flash.display.BitmapData;
  28.     import flash.display.Loader;
  29.     import flash.display.Sprite;
  30.     import flash.events.Event;
  31.     import flash.events.MouseEvent;
  32.     import flash.geom.Matrix;
  33.     import flash.geom.Point;
  34.     import flash.net.URLRequest;
  35.     import flash.system.LoaderContext;
  36.     
  37.     import net.hires.debug.Stats;
  38.     
  39.     [SWF(width = "465", height = "465", frameRate = "30", backgroundColor = "0x000000")]
  40.     public class box extends Sprite
  41.     {
  42.         private var _container:Sprite;
  43.         private var _canvas:Sprite;
  44.         private var _bmd:BitmapData;
  45.         private var _stageW:Number = 465;
  46.         private var _stageH:Number = 465;
  47.         private var _w:Number;
  48.         private var _cP0:CirclePoint;
  49.         private var _cP1:CirclePoint;
  50.         private var _cP2:CirclePoint;
  51.         private var _cP3:CirclePoint;
  52.         private var _matrixArray:Array;
  54.         //格子のどこに画像が描画されているかを見るためのテスト用画像
  55.         private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/base.jpg";        
  56.         
  57.         //private const IMAGE_URL:String = "http://www.planet-ape.net/wonderfl/kuri.jpg";        
  58.         
  59.         public function box()
  60.         {
  61.             if (stage) init();
  62.             else addEventListener(Event.ADDED_TO_STAGE, init);
  63.         }
  64.         
  65.         private function init(e:Event = null):void 
  66.         {
  67.             removeEventListener(Event.ADDED_TO_STAGE, init);
  68.             //画像の読み込み
  69.             var req:URLRequest = new URLRequest(IMAGE_URL);
  70.             var loader:Loader = new Loader();
  71.             loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);    
  72.             loader.load( req, new LoaderContext(true));
  73.             // take a capture after 10 sec
  74.             //Wonderfl.capture_delay( 120 );
  75.         }
  76.         
  77.         //画像読み込み後の処理
  78.         private function loadComplete(e:Event):void 
  79.         {
  80.             e.target.removeEventListener(Event.COMPLETE, loadComplete);
  81.         
  82.             //取得した画像を切り取って_bmdに入れる
  83.             _bmd = new BitmapData (350, 350, true, 0xFFFFFF);
  84.             _bmd.draw (e.target.loader.content.bitmapData);
  85.             
  86.             //キャンバスを用意してコンテナに入れる(重要じゃないので無視無視)
  87.             _canvas = new Sprite();
  88.             _container = new Sprite();
  89.             _container.addChild(_canvas);
  90.             addChild(_container);
  91.             _container.x = (_stageW - _bmd.width)/2;
  92.             _container.y = (_stageH - _bmd.height)/2;
  93.             
  94.             //画像の大きさに合わせ、ポイントを5ｘ5の格子に配置する(配列に入れる）
  95.             //CirclePointのコンストラクタの中で初期状態のポイント位置を保持してます。（initPoint）
  96.             //その初期ポイントと、マウスドラッグで移動したポイントを比較してるのが、_drawの中。
  97.             _w = _bmd.width / 5;
  99.             _matrixArray = new Array ();
  100.             //x軸とy軸の2重ループ(配列に入れる
  101.             for (var j:int = 0; j <= _bmd.width; j += _w) {
  102.                 for (var i:int = 0; i <= _bmd.height; i += _w) {
  103.                     var cp:CirclePoint = new CirclePoint (i, j);
  104.                     trace ('cp'+i+':' + cp.initPoint);
  105.                     _matrixArray.push (cp);
  106.                     //ポイントのドラッグとかの設定
  107.                     //※ドラッグした時に_drawを呼び出してます。
  108.                     cp.addEventListener(MouseEvent.MOUSE_DOWN , _cPMouseDownHandler );
  109.                     _container.addChild (cp);
  110.                 }
  111.             }
  112.             _draw();
  113.             
  114.             //速度とかメモリとかチェック(重要じゃないので無視無視)
  115.             addChild(new Stats());
  116.         }
  117.         
  118.         private function _draw():void {
  119.             /**
  120.              * ポイントの番号は↓な感じ。
  121.              *   0--------1
  122.              *   ----------
  123.              *   ----------
  124.              *   2--------3
  125.              */            
  126.             //マトリックスを適応
  127.             _canvas.graphics.clear();
  129.             //配列のループ
  130.             for (var k:String in _matrixArray) {
  131.                 //
  132.                 if (int(k) > 29) break;
  133.                 if ((int (k) + 1) % 6 == 0) continue;
  134.                 //初期状態のポイント取得
  135.                 _cP0 = _matrixArray[int (k)];
  136.                 _cP1 = _matrixArray[int (k) + 1];
  137.                 _cP2 = _matrixArray[int (k) + 6];
  138.                 _cP3 = _matrixArray[int (k) + 7];
  139.                 
  140.                 var aP0:Point = _cP0.initPoint;
  141.                 var aP1:Point = _cP1.initPoint;
  142.                 var aP2:Point = _cP2.initPoint;
  143.                 var aP3:Point = _cP3.initPoint;
  145.                 //初期状態のポイントよりマトリックス取得
  146.                 var initMatrix1:Matrix = _getTransformMatrix( aP0 , aP1 , aP2 );
  147.                 var initMatrix2:Matrix = _getTransformMatrix( aP3 , aP2 , aP1 );
  148.                 //変更状態のポイント取得
  149.                 var bP0:Point = new Point(_cP0.x , _cP0.y );
  150.                 var bP1:Point = new Point(_cP1.x , _cP1.y );
  151.                 var bP2:Point = new Point(_cP2.x , _cP2.y );
  152.                 var bP3:Point = new Point (_cP3.x , _cP3.y );
  153.                 //変更状態のポイントよりマトリックス取得
  154.                 var editMatrix1:Matrix = _getTransformMatrix( bP0 , bP1 , bP2 );
  155.                 var editMatrix2:Matrix = _getTransformMatrix( bP3 , bP2 , bP1 );
  156.                 //初期状態と変更状態のマトリックスを合体
  157.                 var newMatrix1:Matrix = initMatrix1.clone();
  158.                 newMatrix1.concat(editMatrix1);
  159.                 var newMatrix2:Matrix = initMatrix2.clone();
  160.                 newMatrix2.concat(editMatrix2);
  161.                 
  162.                 //（無理やり）分割した１個目の描写のロジック
  163.                 //２個目はわざわざ、別のbitmapDataを用意しなくても直接描画できる。
  164.                 //１個目は別のbitmapDataを用意ないと順番がめちゃくちゃになる。
  165.                                 /*
  166.                 var matBmd:BitmapData = new BitmapData (70, 70, true);
  167.                 var mat:Matrix = new Matrix ();
  168.                 mat.tx = - aP0.x;
  169.                 mat.ty = - aP0.y;
  170.                 matBmd.draw (_bmd, mat);
  171.                                 */
  172.                 //分割した１個目を描画
  173.                 _canvas.graphics.lineStyle(1 , 0x00FF00);
  174.                 _canvas.graphics.beginBitmapFill(_bmd , newMatrix1 );
  175.                 _canvas.graphics.moveTo(bP0.x , bP0.y );
  176.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  177.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  178.                 _canvas.graphics.endFill ();
  179.                 
  180.                 //分割した２個目を描画
  181.                 _canvas.graphics.lineStyle(1 , 0x00FF00);
  182.                 _canvas.graphics.beginBitmapFill(_bmd , newMatrix2 );
  183.                 _canvas.graphics.moveTo(bP3.x , bP3.y );
  184.                 _canvas.graphics.lineTo(bP1.x , bP1.y );
  185.                 _canvas.graphics.lineTo(bP2.x , bP2.y );
  186.                 _canvas.graphics.endFill();
  187.             }            
  188.         }
  189.         
  190.         
  191.         private function _getTransformMatrix($pt0:Point, $pt1:Point, $pt2:Point):Matrix
  192.         {
  193.             /*
  194.             http://www.adobe.com/jp/devnet/flash/articles/matrix_class.html
  195.             a: 水平方向の伸縮率 = 変換後の幅/もとの幅
  196.             b: 垂直方向の傾斜率 = 垂直方向の傾斜/もとの幅
  197.             c: 水平方向の傾斜率 = 水平方向の傾斜/もとの高さ
  198.             d: 垂直方向の伸縮率 = 変換後の高さ/もとの高さ
  199.             tx: 水平方向の移動ピクセル数
  200.             ty: 垂直方向の移動ピクセル数
  201.             */
  202.             var w:Number = _w;
  203.             var h:Number = _w;
  204.             var mat:Matrix = new Matrix();
  205.             mat.a = ($pt1.x - $pt0.x) / w;
  206.             mat.b = ($pt1.y - $pt0.y) / w;
  207.             mat.c = ($pt2.x - $pt0.x) / h;
  208.             mat.d = ($pt2.y - $pt0.y) / h;
  209.             mat.tx = $pt0.x;
  210.             mat.ty = $pt0.y;
  211.             return mat;
  212.         }
  213.         
  214.         //こっからマウスのドラッグとかの設定（無視無視）
  215.         private function _cPMouseDownHandler(e:MouseEvent):void {
  216.             CirclePoint(e.target).startDrag();
  217.             CirclePoint(e.target).addEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  218.             stage.addEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  219.         }
  220.         
  221.         private function _cPMouseUpHandler(e:MouseEvent):void {
  222.             CirclePoint(e.target).stopDrag();
  223.             CirclePoint(e.target).removeEventListener(MouseEvent.MOUSE_MOVE , _cPMouseMoveHandler );
  224.             stage.removeEventListener(MouseEvent.MOUSE_UP , _cPMouseUpHandler );
  225.         }
  226.         
  227.         private function _cPMouseMoveHandler(e:MouseEvent):void {
  228.             _draw();
  229.         }
  230.         
  231.         
  233.     }
  234. }
  237. import flash.display.Bitmap;
  238. import flash.display.Shape;
  239. import flash.display.BitmapData;
  240. import flash.display.Sprite;
  241. import flash.geom.Point;
  243. /**
  244.  * 赤い点を書いてる。
  245.  * それと初期状態のポイントをinitPointに保持してる。
  246.  */
  247. class CirclePoint extends Sprite {
  248.     public var initPoint:Point;
  249.     public function CirclePoint($x:Number , $y:Number) {
  250.         this.x = $x;
  251.         this.y = $y;
  252.         this.initPoint = new Point( $x , $y );
  253.         this.graphics.beginFill(0xFF0000,1);
  254.         this.graphics.drawCircle(0,0,5);
  255.         this.graphics.endFill();
  256.         this.buttonMode = true;
  257.     }
  258. }
  260. /**
  261.  * このTestImageクラスは画像の代わりに無理矢理、
  262.  * BitmapDataを作成してるだけなので無視無視無視無視無視。
  263.  */
  264. class TestImage extends Bitmap {
  265.     private var _w:Number = 200;
  266.     private var _h:Number = 200;
  267.     public function TestImage():void {
  268.         var s:Shape = new Shape();
  269.         s.graphics.beginFill(0xCCCCCC , 1 );
  270.         s.graphics.drawRect(0,0,_w,_h);
  271.         s.graphics.beginFill(0xFCFCFC , 1 );
  272.         s.graphics.drawRoundRect(30 , 30 , 30 , 10 , 20 ,20);
  273.         s.graphics.drawRoundRect(140 , 30 , 30 , 10 , 20 ,20);
  274.         s.graphics.drawCircle(50,70,10);
  275.         s.graphics.drawCircle(150,70,10);
  276.         s.graphics.drawCircle(75,120,5);
  277.         s.graphics.drawCircle(125,120,5);
  278.         s.graphics.drawRoundRect(40 , 170 , 120 , 10 , 20 ,20);
  279.         s.graphics.endFill();
  280.         
  281.         var bmd:BitmapData = new BitmapData(_w,_h);
  282.         bmd.draw(s);
  283.         this.bitmapData = bmd;
  284.     }
  285. }
noswf
Get Adobe Flash Player