1 Reply Latest reply on Jul 23, 2011 1:27 PM by Shongrunden

    MX and Spark Rotate effects in Flex 4.5

    Johnking08 Level 1

      I'm porting an application from Flex 3.1 to 4.5 and having following problems with the Rotate effect:

       

      1. I want to keep using mx.effects.Move, but the originX and originY properties of mx.effects.Rotate in 4.5 do not work correctly.

      It seems no effect on location of the rotation center, which is always (0,0) no matter what values you set.

      Is this a bug with MX effects in 4.5. I'm using the trial version.

       

      2. Adobe suggests to use Spark effects, but I can not use spark.effects.Rotate because there are no originX and originY properties with it.

      The rotation center for Spark Rotate is (0,0). It seems cannot be changed.

       

      Any suggestions?

        • 1. Re: MX and Spark Rotate effects in Flex 4.5
          Shongrunden Adobe Employee

          1. Is the element you are animating inside of a spark container?

           

          2. Try using the transformX/transformY properties on the element itself rather than on the effect.

           

          <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"

                         xmlns:s="library://ns.adobe.com/flex/spark">

              <fx:Declarations>

                  <s:Rotate id="r" target="{b}" angleBy="360"/>

              </fx:Declarations>

              <s:Button id="b" x="100" y="100" label="Rotate" click="r.play()" transformX="20" transformY="11" />

          </s:WindowedApplication>

           

          You might find the autoCenterTransform property of the effect useful as well.

           

          <s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"

                         xmlns:s="library://ns.adobe.com/flex/spark">

              <fx:Declarations>

                  <s:Rotate id="r" target="{b}" angleBy="360" autoCenterTransform="true"/>

              </fx:Declarations>

              <s:Button id="b" x="100" y="100" label="Rotate" click="r.play()"/>

          </s:WindowedApplication>

          1 person found this helpful