スポンサーサイト

-------- | --:--

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

[ActionScript 3.0] 画像を平行四辺形に変形

2007-11-08 | 20:03

画像を平行四辺形に変形するのは非常に簡単である。
各辺の方向に座標系を変換するような行列を作ってやればよい。

下のデモでは、円をドラッグ&ドロップで動かすとその方向に変形します。

package
{
    import flash.display.*;
    import flash.geom.*;
    import flash.events.*;
    import flash.utils.*;

    [SWF(width='600',height='300',backgroundColor='0xffffff',framerate='30')]
        public class Main extends Sprite{       
            [Embed(source="lena.jpg")]
                private var bm:Class;

            private var bmp2:Bitmap; 
            private var rad:Number = 0.0;
            private var xBase:int = 400;
            private var yBase:int = 100;
            private var originalHeight:Number = 0.0;
            private var originalWidth:Number = 0.0;

            private var xa:Number = 1.0;
            private var xb:Number = 0.0;
            private var ya:Number = 0.0;
            private var yb:Number = 1.0;

            public function Main(){
                var bmp:Bitmap = new bm() as Bitmap;
                addChild(bmp);
                bmp.x = 100;
                bmp.y = 100;

                bmp2 = new bm() as Bitmap;
                bmp2.x = xBase;
                bmp2.y = yBase;;
                addChild(bmp2);

                originalHeight = bmp2.height;
                originalWidth = bmp2.width;

                var red:Sprite = createCircle( 0xFF0000, 10 );
                var green:Sprite = createCircle(0x00FF00, 10);
                green.x = 400 + bmp2.width;
                yBase = green.y = 100;
                xBase = red.x = 400;
                red.y = 100 + bmp2.height;
                addChild( red );
                addChild( green );

                red.addEventListener( MouseEvent.MOUSE_DOWN, pickup );
                red.addEventListener( MouseEvent.MOUSE_UP, function(e:Event):void{
                        e.target.stopDrag( );
                        ya = (stage.mouseX - xBase) / originalWidth;
                        yb = (stage.mouseY - yBase) / originalHeight;
                        distort();
                        });
                green.addEventListener( MouseEvent.MOUSE_DOWN, pickup );
                green.addEventListener( MouseEvent.MOUSE_UP, function(e:Event):void{
                        e.target.stopDrag( );
                        xa = (stage.mouseX - xBase) / originalWidth;
                        xb = (stage.mouseY - yBase) / originalHeight;
                        distort();
                        });
            }

            private function pickup( event:MouseEvent ):void {
                event.target.startDrag( );
            }

            private function createCircle( color:uint, radius:Number ):Sprite {
                var shape:Sprite = new Sprite( );
                shape.graphics.beginFill( color );
                shape.graphics.drawCircle( 0, 0, radius );
                shape.graphics.endFill( );
                return shape;
            }

            private function distort():void{
                var matrixT:Matrix = new Matrix(xa, xb, ya, yb);
                var m:Matrix = new Matrix(1,0,0,1);
                m.concat(matrixT);
                m.translate(xBase,yBase);
                bmp2.transform.matrix = m;
            }

        }
}

スポンサーサイト

Trackback


この記事にトラックバックする(FC2ブログユーザー)

オンライン対戦FLASHゲーム3

今週は風邪引きっぱなしでしたわい 幸い豚インフルではなかったです。やっと完治! さて今回FLASHゲームの進捗はビジュアル面中心。 この...

Comment

Post a comment

Secret

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。