Matrixを勉強！！（２）

前回、紹介したサイトの最後のほうに載っていた３つのポイントから、
動的に平行四辺形を作成するというものに挑戦しました。


ほとんど、見ながらやりましたが…＾＾；


Matrixクラスのaとd、txとtyプロパティは何が入るか分かっているのですが、
bとcについては全くです…。
傾斜をつける際に、この値をいじるということはわかりましたが、
なぜ、左上と右上のy座標の差からSpriteの幅を割ると、
bが求めれるかについては、さっぱりです。


Matrixって、難しいですね。
Flash10には、Matrix3Dクラスというのが増えていたようですが、
Matrixで詰まっていては、だめですね。
もう少し、勉強してみます。


一応、ソースコードを載せておきます。

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.geom.Matrix;
	
	[SWF(width=800, height=600, backgroundColor=0xAADDFF)]

	public class Main02 extends Sprite {
		
		private var point0:Sprite = new Sprite();
		private var point1:Sprite = new Sprite();
		private var point2:Sprite = new Sprite();
		private var rect:Sprite = new Sprite();
		
		public function Main02() {
			initPoint(point0, 300, 200);
			initPoint(point1, 500, 200);
			initPoint(point2, 300, 300);
			
			rect.graphics.beginFill(0x0000FF);
			rect.graphics.drawRect(0, 0, 200, 100);
			rect.graphics.endFill();
			rect.x = 300;
			rect.y = 200;
			addChildAt(rect, 0);
			
			addEventListener(Event.ENTER_FRAME, onEnterFrame);
		}
		
		private function initPoint(point:Sprite, x:Number, y:Number):void {
			initPointDesign(point);
			point.x = x;
			point.y = y;
			addChild(point);
			
			point.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
			point.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
		}
		
		private function initPointDesign(point:Sprite):void {
			point.graphics.lineStyle(3);
			point.graphics.beginFill(0xFF0000, 0.5);
			point.graphics.drawCircle(0, 0, 10);
			point.graphics.endFill();
		}
		
		private function xTransform():void {
			var mat:Matrix = new Matrix();
			mat.translate(point0.x, point0.y);
			rect.transform.matrix = mat;
			mat.a = (point1.x - rect.x) / rect.width;
			mat.b = (point1.y - rect.y) / rect.width;
			mat.c = (point2.x - rect.x) / rect.height;
			mat.d = (point2.y - rect.y) / rect.height;
			rect.transform.matrix = mat;
		}
			
		private function onMouseDown(event:MouseEvent):void {
			Sprite(event.currentTarget).startDrag();
		}
		
		private function onMouseUp(event:MouseEvent):void {
			Sprite(event.currentTarget).stopDrag();
		}
		
		private function onEnterFrame(event:Event):void {
			xTransform();
		}
		
	}
}