クリックしたところを中心に回転
クリックしたところを中心に回転させます。
以前Flexを使用していたとき、回転の起点座標の指定ってどうするんだろうって思ってて、最近わかったので、メモ。むしろ後輩に教えてもらった。
//originX,originYで回転の中心が設定できます。
myR.originX = myImage.mouseX;
myR.originY = myImage.mouseY;
myR.play();
クリックしたことろを起点にして回転をします。
実際のサンプルはこちら
http://moeten.info/flex/20080310_myRotate/bin-release/main.html
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()"> <mx:Script> <![CDATA[ import mx.events.EffectEvent; import mx.effects.Rotate; private function init():void{ myImage.source = "36.jpg"; //クリックでイベント発動 myImage.addEventListener(MouseEvent.CLICK , myRotate ); } private function myRotate( e:MouseEvent ):void{ //エフェクト中にイベントの再読み込みを禁止 myImage.removeEventListener(MouseEvent.CLICK , myRotate ); //回転エフェクト作成 var myR:Rotate = new Rotate(); myR.angleFrom = 0; myR.angleTo = 360; myR.target = myImage; //マウスの場所を中心に回転 myR.originX = myImage.mouseX; myR.originY = myImage.mouseY; myR.play(); //エフェクト終了したので、クリックを受け付ける myR.addEventListener( EffectEvent.EFFECT_END , function():void{ myImage.addEventListener(MouseEvent.CLICK , myRotate ); }); } ]]> </mx:Script> <mx:Image x="10" y="10" width="333" height="275" id="myImage"/> </mx:Application>
前は大きいキャンバスにaddchildしてそこを起点にして回転とかちょっとトリッキーなことをしてました(^^;