Skip navigation
P.o.l.a.c.o
Currently Being Moderated

Multiple Rotate3d filters makes everything looks blurry

Apr 9, 2012 9:38 AM

Tags: #distortion #blur #transformation #rotate3d

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>

 
Replies

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points