ReefKey Software Inc

I, like many others, have run into this problem. It seems that the rotation property (from Display Object) registers the rotation point of an object at x=0 and y=0. After searching the web I found a solution for which uses the mx.effect.Rotation. This works great for non spark components but I my project was using all spark components. So, I updated the code to reflect how to rotate an object with spark.effects.Rotate. Quite honestly, this version is simpler than the mx version.

Here is the original post from which i based this code:

http://www.flexdeveloper.eu/forums/actionscript-3-0/as3-rotation-of-uico...

Here is the original code:


private var rotate:Rotate = new Rotate();

private function setRotate(evt:SliderEvent):void
{
_angle = evt.value;

rotate.target = myCanvas;
if(rotate.isPlaying) rotate.end();
rotate.angleFrom = _prevAngle;
rotate.angleTo = _angle;
rotate.originX = myCanvas.width/2;
rotate.originY = myCanvas.height/2;
rotate.easingFunction = Elastic.easeOut;
rotate.play();
_prevAngle = _angle;
}

Here is the spark version:


var rotate:spark.effects.Rotate = new Rotate();

tmp = Door(Model.getInstance().currentShape);
rotate.target = tmp;
if(rotate.isPlaying) rotate.end();
rotate.angleFrom = tmp.angle;
rotate.angleTo = rotationSlider.value;
rotate.autoCenterTransform = true;
rotate.play();
tmp.angle = rotationSlider.value;

Im my case, I'm using an object which has a getter/setter for the angle. Otherwise, you will need to track the current angle to pass to the angleTo property. This version is easier than the mx version because you can simply specify the autoCenterTransform property to true. This will automatically register the rotation point as the center of the object.