Einen Schnappschuss machen, skalieren und wiederholen

Question

Ich versuche, Text von 1 bis 5 zu skalieren, eine Art Zoom in der Art des Aussehens. Ich verwende den folgenden Code:

<s:Scale target="myLabel" autoCenterTransform="true" 
     duration="2000" 
     scaleYFrom="1" scaleYTo="5" scaleXFrom="1" scaleXTo="5" 
     > 

Der Text skaliert furchtbar. Also mein Ziel ist es, eine Momentaufnahme der Textbeschriftung in einer großen Schriftart zu machen, sie der Anzeigeliste hinzuzufügen, die Skalierung auf eine 5 zu setzen und dann die Skalierung auf 1 zu animieren. Danach muss ich den Text erneut einstellen und machen es ist wieder alles.

Dies ist eine Flex-App und das ist, wo meine Frage kommt. Ich weiß nicht, wie man einen Schnappschuss macht, dann, was es zu (Gruppe?) Hinzufügen und dann löschen und neu beginnen? Jeder Rat in diesem Fall wäre willkommen.

Answer 1

Hier ist eine sehr einfache Ansatz, der die size Stil beseelt, anstatt die Skalierungseigenschaften von Animieren:

Je nachdem, was Sie tun dies auch nicht durchführen kann, b/c es so häufig einen neuen Stil setzt. Auch wenn Sie diese Animation langsam spielen, sieht es so aus, als ob die einzelnen Charaktere "wackeln" (sie bewegen oder schütteln ein kleines bisschen).

Ich werde etwas schreiben auf einen Snapshot zu nehmen und dass im nächsten Skalierung ...

<?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"> 
    <fx:Declarations> 
     <s:Animate id="scaler" target="{scaledText}" > 
      <s:MotionPath property="fontSize"> 
       <s:Keyframe time="0" value="12"/> 
       <s:Keyframe time="1500" value="48"/> 
      </s:MotionPath> 
     </s:Animate> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 

      protected function onLabelClick():void 
      { 
       scaler.play(); 
      } 

     ]]> 
    </fx:Script> 

    <s:Label id="scaledText" text="this is some text" click="onLabelClick()" /> 
</s:Application> 

Und hier ist der Ansatz, der eine Momentaufnahme des Textes nimmt. Dies hat das gleiche Problem wie Ihre ursprüngliche Lösung, der skalierte Text ist sehr gezackt. Aber das ist, wie Sie einen Schnappschuss von etwas zu nehmen und den Schnappschuss in einem anderen Flex-Objekt verwenden:

<?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"> 
    <fx:Declarations> 
     <s:Scale id="scaler" target="{drawingTarget}" scaleXFrom="1" scaleXTo="5" scaleYFrom="1" scaleYTo="5"/> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 
      import spark.core.SpriteVisualElement; 

      protected function onLabelClick():void 
      { 
       var data:BitmapData = new BitmapData(200,200,true, 0xFFFFFF); 
       data.draw(scaledText); 

       var g:Graphics = drawingTarget.graphics; 
       g.beginBitmapFill(data); 
       g.drawRect(0,0, 200,200); 
       g.endFill(); 
      } 

      protected function onBitmapClick(event:MouseEvent):void 
      { 
       scaler.play(); 
      } 

     ]]> 
    </fx:Script> 

    <s:layout> 
     <s:VerticalLayout/> 
    </s:layout> 

    <s:Label id="scaledText" text="this is some text" click="onLabelClick()" /> 
    <s:SpriteVisualElement id="drawingTarget" width="200" height="200" click="onBitmapClick(event)"/> 
</s:Application>