1 Reply Latest reply: Apr 9, 2012 12:11 PM by P.o.l.a.c.o RSS

    Multiple Rotate3d filters makes everything looks blurry

    P.o.l.a.c.o Community Member

      Hi I have a Flex 4 project that uses two rotate filters.

      Once it to rotate the main container and the other to rotate an internal element.

      The issue is that when applied simultaneously text, and everything looks blurry.

      If I add a delay time to one of the effects so they are not applied simultaneously then the blurry effect seems to be fixed.

      The thing is that I would like not to be aware if there is a rotation effect in a parent container or something like that, just want to apply the effect and that it work as intended.

      Any suggestion or good practice to slove this?

       

       

      Thanks in advanced

       

       

      This is the "bug" demo file (remove the ".zip" part)

      http://www.yourfilelink.com/get.php?fid=795616

       

       

      Code sample (remove the  " startDelay='5000' " of the filter to see the blurry effect):

       

      <?xml version="1.0" encoding="utf-8"?>

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

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

                     xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="rotationEffect1.play();rotationEffect0.play()">

          <fx:Style>

              @namespace s "library://ns.adobe.com/flex/spark";

              @namespace mx "library://ns.adobe.com/flex/mx";

             

              @font-face {

                  src: url("../static/OpenSans-Regular.ttf");

                  fontFamily: "FONT_BASE";

                  embed-as-cff: true;

                  advancedAntiAliasing: true;

              }

             

              .baseText{

                  fontSize:18pt;

                  fontFamily: FONT_BASE;

                  contentBackgroundAlpha:0;

                  borderVisible:false;

                  color:#FF0000;

              }

             

          </fx:Style>

          <fx:Declarations>

              <s:Rotate3D id="rotationEffect1"

                          angleYFrom="60"

                          angleYTo="0"

                          duration="1000"

                          disableLayout="true"

                          autoCenterProjection="true"

                          autoCenterTransform="true"

                          target="{mainContainer}"

                          />

              <s:Rotate3D id="rotationEffect0"

                          angleYFrom="0"

                          angleYTo="60"

                          duration="2000"

                          disableLayout="true"

                          autoCenterProjection="true"

                          autoCenterTransform="true"

                          startDelay="5000"

                          target="{theimage}"

                          />

          </fx:Declarations>

          <fx:Script>

              <![CDATA[

                  [Bindable]

                  [Embed(source="../static/image.png")]

                  private var photoImage:Class;

              ]]>

          </fx:Script>

          <s:Group id="mainContainer" x="0" y="0" clipAndEnableScrolling="false" width="600" height="600">

              <s:Label text="Hellooooo people" x="200" y="200" styleName="baseText"/>

              <s:TextArea text="Hi There!\r\n watch this!fkosa okfdsofak kpfaksdpfk\n\r ffdsafasfd"  x="200" y="300" styleName="baseText" editable="false"  selectable="false"/>

              <s:Image id="theimage" x="200" y="400" source="{photoImage}"  width="200" height="200"/>

          </s:Group>

      </s:Application>