Problem
In one of the application we have requirement to rotate an image object from the center.
Solution
On the coding side, one of our team member have suggest some bitmap's matrix trick, and finally we completed that task. We used the image's transform.matrix to manipulate this center point and translate then rotate.
Detailed explanation
Below is the sample code for the same.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
<mx:Script>
<![CDATA[
import mx.events.SliderEvent;
import mx.controls.sliderClasses.Slider;
import mx.core.UIComponent;
private function rotateCurrentObject(img:UIComponent, angle:Number):void
{
var imgMatrix:Matrix = img.transform.matrix;
var centerX:Number = img.width / 2;
var centerY:Number = img.height / 2;
var centerPoint:Point = new Point(centerX, centerY);
var transformPoint:Point= imgMatrix.transformPoint(centerPoint);
imgMatrix.translate(-transformPoint.x, -transformPoint.y);
imgMatrix.rotate(angle * Math.PI / 180);
imgMatrix.translate(transformPoint.x, transformPoint.y);
img.transform.matrix = imgMatrix;
}
private function onSliderChange(event:SliderEvent):void
{
rotateCurrentObject(img, event.value);
}
]]>
</mx:Script>
<mx:Image id="img" source="http://www.google.com/images/logos/ps_logo2.png"/>
<mx:HSlider minimum="-180" maximum="180" value="0" liveDragging="true" change="onSliderChange(event)" />
</mx:Application>
Thanks, Virat Patel
+
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. Permissions beyond the scope of this license, pertaining to the examples of code included within this work are available at Adobe.
Report abuse
