７．画像を変形させてみる１
長方形を平行四辺形にしたい
「円柱」（缶の部分ね）の側面は１２枚の画像で構成されています。
各画像はもともと長方形ですが、それを必要に応じ平行四辺形に変形させています。
ＭＸ２００４だと、画像のムービークリップ（子ＭＣ）を持つＭＣ（親ＭＣ）を用意し、子ＭＣを４５°回転させて、その状態で親ＭＣを変形（xscale,yscaleを決める）させる、というちょっと面倒なことをしています。
参照サイトに詳しく紹介されていますね。
恐るべし！ＦＬＡＳＨ８
噂には聞いてましたが、ＦＬＡＳＨ８からいろいろとできるようになったんですよね。
ブラーとか、ドロップシャドウとかグローって言うんですか？スターウォーズのライトセーバーみたいなの。
そんな中に、オブジェクトを変形させることができるなんてのをどこかで見まして、、、
つまり、今やりたい長方形を平行四辺形に変形させる、というのが簡単にできるということ？！
Transformクラスらしい
調べてみると、確かにできるみたい！
Transformクラスなるものがあるそうです、すご〜！
そんなわけで、画像を変形させてみました。
//test.as 画像変形テスト１
package {
import flash.display.*;
import flash.events.*;
import flash.net.URLRequest;
import flash.geom.Matrix;
public class test extends Sprite {//クラス宣言
private var message:messagebox;
private var img:Loader;
private var a:Number=0;//■
public function test(){//コンストラクタ
message = new messagebox();
addChild(message.container);
var tURL:String = "testimg2.swf";
var urImage:URLRequest = new URLRequest(tURL);
img = new Loader();
img.load(urImage);
img.x=100;
img.y=150;
addChild(img);
addEventListener(Event.ENTER_FRAME, loading);
img.addEventListener(MouseEvent.CLICK, onClick);//■イベントリスナー設定
}
private function loading(event:Event):void {//画像読み込み
message.show("READING-"+img.contentLoaderInfo.bytesLoaded+
"/"+img.contentLoaderInfo.bytesTotal);
var rate:Number=img.contentLoaderInfo.bytesLoaded/
img.contentLoaderInfo.bytesTotal;
if ( (rate >= 1)&&(img.contentLoaderInfo.bytesTotal > 100) ){
message.show("COMPLETE!");
removeEventListener( Event.ENTER_FRAME, loading );
}
}
private function onClick(evt:MouseEvent):void {//■画像をクリックしたら実行される関数
a+=0.1;
message.show("CLICK!･･･a="+a);
//マトリックス
var myMatrix:Matrix = img.transform.matrix;
myMatrix.tx = 100;
myMatrix.ty = 150;
myMatrix.a =1;
myMatrix.b =a;
myMatrix.c = 0;
myMatrix.d = 1;
img.transform.matrix = myMatrix;
}
}
}
package {
import flash.display.*;
import flash.events.*;
import flash.net.URLRequest;
import flash.geom.Matrix;
public class test extends Sprite {//クラス宣言
private var message:messagebox;
private var img:Loader;
private var a:Number=0;//■
public function test(){//コンストラクタ
message = new messagebox();
addChild(message.container);
var tURL:String = "testimg2.swf";
var urImage:URLRequest = new URLRequest(tURL);
img = new Loader();
img.load(urImage);
img.x=100;
img.y=150;
addChild(img);
addEventListener(Event.ENTER_FRAME, loading);
img.addEventListener(MouseEvent.CLICK, onClick);//■イベントリスナー設定
}
private function loading(event:Event):void {//画像読み込み
message.show("READING-"+img.contentLoaderInfo.bytesLoaded+
"/"+img.contentLoaderInfo.bytesTotal);
var rate:Number=img.contentLoaderInfo.bytesLoaded/
img.contentLoaderInfo.bytesTotal;
if ( (rate >= 1)&&(img.contentLoaderInfo.bytesTotal > 100) ){
message.show("COMPLETE!");
removeEventListener( Event.ENTER_FRAME, loading );
}
}
private function onClick(evt:MouseEvent):void {//■画像をクリックしたら実行される関数
a+=0.1;
message.show("CLICK!･･･a="+a);
//マトリックス
var myMatrix:Matrix = img.transform.matrix;
myMatrix.tx = 100;
myMatrix.ty = 150;
myMatrix.a =1;
myMatrix.b =a;
myMatrix.c = 0;
myMatrix.d = 1;
img.transform.matrix = myMatrix;
}
}
}
■の所が変わった部分でしょうか。
画像をクリックすると、Transformクラスを使って変形します。
関数onClick内で見よう見まねで（？！）Matrix使ってますが、とりあえず動作してます！
すごいっ！ＦＬＡＳＨ８！