Comments on: Rotating images using the Rotate class http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/ Just a bunch of Adobe Flex Examples Sat, 11 Feb 2012 11:51:51 +0000 hourly 1 By: Circass http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-8214 Circass Wed, 11 Aug 2010 05:59:29 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-8214 Hello, i am trying to rotate my image which is a child of my view panel. I wrote something like that : var rotate:mx.effects.Rotate = new mx.effects.Rotate(); //var iTmp:Image = new Image(); //iTmp = viewerPanel.getChildAt(0) as Image; rotate.target= viewerPanel.getChildAt(0); rotate.angleFrom=viewerPanel.getChildAt(0).rotation; rotate.angleTo=viewerPanel.getChildAt(0).rotation – 90; rotate.duration=1000; rotate.originX=viewerPanel.getChildAt(0).width/2; rotate.originY=viewerPanel.getChildAt(0).height/2; rotate.play(); it rotates the panel from top left. then i wrote something like that : var iTmp:Image = new Image(); iTmp = viewerPanel.getChildAt(0) as Image; var q:Number = 90 * Math.PI / 180 // 30 degrees in radians var m:Matrix = new Matrix(); var centerX:Number = iTmp.width / 2; var centerY:Number = iTmp.height /2; m.translate(-1 * centerX, -1 * centerY); m.rotate(q); viewerPanel.removeChildAt(0); viewerPanel.addChild(iTmp); and this made the same thing. So How can i rotate an image which is added to a panel as a child ? Thank you. Hello,
i am trying to rotate my image which is a child of my view panel.
I wrote something like that :

var rotate:mx.effects.Rotate = new mx.effects.Rotate();
//var iTmp:Image = new Image();
//iTmp = viewerPanel.getChildAt(0) as Image;
rotate.target= viewerPanel.getChildAt(0);
rotate.angleFrom=viewerPanel.getChildAt(0).rotation;
rotate.angleTo=viewerPanel.getChildAt(0).rotation – 90;
rotate.duration=1000;
rotate.originX=viewerPanel.getChildAt(0).width/2;
rotate.originY=viewerPanel.getChildAt(0).height/2;
rotate.play();

it rotates the panel from top left.

then i wrote something like that :
var iTmp:Image = new Image();
iTmp = viewerPanel.getChildAt(0) as Image;
var q:Number = 90 * Math.PI / 180 // 30 degrees in radians
var m:Matrix = new Matrix();
var centerX:Number = iTmp.width / 2;
var centerY:Number = iTmp.height /2;
m.translate(-1 * centerX, -1 * centerY);
m.rotate(q);
viewerPanel.removeChildAt(0);
viewerPanel.addChild(iTmp);
and this made the same thing.

So How can i rotate an image which is added to a panel as a child ?
Thank you.

]]> By: Peter deHaan http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-6945 Peter deHaan Sat, 06 Feb 2010 18:17:06 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-6945 @Johnny Doe, I believe it's possible in Flex 3 if you target Flash Player 10. Peter @Johnny Doe,

I believe it’s possible in Flex 3 if you target Flash Player 10.

Peter

]]> By: Johnny Doe http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-6944 Johnny Doe Sat, 06 Feb 2010 17:56:40 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-6944 More importantly... How can I rotate an images rotateX, rotateY, and rotateZ? 3D rotation using Flex 3, without special libs or plugins... is it possible? More importantly… How can I rotate an images rotateX, rotateY, and rotateZ? 3D rotation using Flex 3, without special libs or plugins… is it possible?

]]> By: Allen http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-6922 Allen Thu, 04 Feb 2010 17:37:56 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-6922 Hi, The rotation feature is good. I need to control the rotation angle by an external feed. Would you have any sample code? Thank You Hi,

The rotation feature is good. I need to control the rotation angle by an external feed. Would you have any sample code? Thank You

]]> By: Mafaz http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-6583 Mafaz Fri, 11 Dec 2009 15:15:00 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-6583 Hello there, The example is a nice one. How can I control the rotation of an image with a mouseDown event? Like I want control on the rotation of the image. What am I supposed to do. Any hints please? Hello there,
The example is a nice one. How can I control the rotation of an image with a mouseDown event? Like I want control on the rotation of the image. What am I supposed to do. Any hints please?

]]> By: halflife_baby http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-6568 halflife_baby Thu, 10 Dec 2009 06:24:40 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-6568 Hi, How to rotate an image to 90 degree when the button is clicked? If i click the button again, it should totate to 180 degree. (ie) agian it should rotate to 90 degree from the last position. I was working with this issue for the last 3 days. Can some one help me? Hi,
How to rotate an image to 90 degree when the button is clicked?
If i click the button again, it should totate to 180 degree. (ie) agian it should rotate to 90 degree from the last position.
I was working with this issue for the last 3 days. Can some one help me?

]]> By: Peter deHaan http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-6028 Peter deHaan Thu, 15 Oct 2009 15:31:19 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-6028 @MechanisM, <pre lang="mxml"> <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:Rotate id="rotatr" angleFrom="0" angleTo="360" repeatCount="0" /> <mx:Image id="logo" source="flex_logo.jpg" mouseOver="rotatr.play([event.currentTarget]);" mouseOut="rotatr.stop();" /> </mx:Application> </pre> Peter @MechanisM,

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
 
    <mx:Rotate id="rotatr"
            angleFrom="0"
            angleTo="360"
            repeatCount="0" />
 
    <mx:Image id="logo"
            source="flex_logo.jpg"
            mouseOver="rotatr.play([event.currentTarget]);"
            mouseOut="rotatr.stop();" />
 
</mx:Application>

Peter

]]> By: MechanisM http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-6024 MechanisM Thu, 15 Oct 2009 09:58:00 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-6024 How to set up rotate on rollOver in loop? I mean when mouse over image its still rotating untill mouse gone out? How to set up rotate on rollOver in loop?
I mean when mouse over image its still rotating untill mouse gone out?

]]> By: peterd http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-2092 peterd Fri, 03 Oct 2008 01:50:40 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-2092 lala, You can try setting the <code>rollOverEffect</code> style/effect: <pre class="code"> <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:Rotate id="rotate" target="{img}" angleFrom="0" angleTo="360" duration="1000" originX="{img.height/2}" originY="{img.width/2}" /> <mx:Image id="img" source="fx_appicon-tn.gif" rollOverEffect="{rotate}" /> </mx:Application> </pre> Peter lala,

You can try setting the rollOverEffect style/effect:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white">

    <mx:Rotate id="rotate"
            target="{img}"
            angleFrom="0"
            angleTo="360"
            duration="1000"
            originX="{img.height/2}"
            originY="{img.width/2}" />

    <mx:Image id="img"
            source="fx_appicon-tn.gif"
            rollOverEffect="{rotate}" />

</mx:Application>

Peter

]]> By: lala http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/comment-page-1/#comment-2091 lala Fri, 03 Oct 2008 00:37:50 +0000 http://blog.flexexamples.com/2007/12/10/rotating-images-using-the-rotate-class/#comment-2091 i wante to do that when i rollOver why can i do that ??? please i wante to do that when i rollOver why can i do that ??? please

]]>