爲什麼這個移動效果在淡入淡出效果時對我的精靈有效？

Question

有人可以解釋爲什麼這不想工作？這是一個標誌後面的裝飾。

當dMove VAR被註釋掉我得到的廣場在沿x = 78軸隨機點淡入淡出的相應行，但推出的時候沒有出現在所有...

private var floatBG:UIComponent = new UIComponent(); 

private function addDP(event:TimerEvent):void{ 

      var dY:Number = 5+Math.ceil(Math.random()*60); 
      var dSize:Number = Math.ceil(Math.random()*12); 
      var dAlpha:Number = Math.random()*0.5 + 0.2 
      var dDuration:Number = Math.ceil(Math.random()*5000) + 1000; 

      var d:Sprite = new Sprite(); 
      d.graphics.beginFill(0x1C75BC,dAlpha); 
      d.graphics.drawRect(78, dY, dSize,dSize); 
      d.graphics.endFill(); 

      floatBG.addChild(d); 

      var dMove:Move = new Move(d); 
      dMove.xBy = 300; 
      dMove.duration = dDuration; 

      dMove.play(); 

      var dFade:Fade = new Fade(d); 
      dFade.alphaFrom = 1; 
      dFade.alphaTo = 0; 
      dFade.duration = dDuration; 

      dFade.play(); 

      this.addElement(floatBG); 

     } 

而且，在每個週期結束時摧毀精靈的最佳/正確方法是什麼？

非常感謝，大量讚賞！

喬希

Answer 1

好了，有點玩了後我設法找到一個解決方案，我真的很感激布萊恩·畢曉普的幫助下，誰管理，很多點我在正確的方向。

布賴恩建議，只需輸入d作爲在UIComponent而是一個sprite允許dMove來實現（我仍然不知道這是爲什麼，因爲dFade影響工作時，它仍然是一個精靈）。但是加入floatBG（BG爲背景，向其中添加所有d的UIComponents的UIComponent）每次是不必要的，所以我做了我creationComplete功能this.addElement(floatBG)部分

然後我跑進了問題，應用程序開始補與d實例（d最初代表「數據點」的方式，這是我試圖創建的效果的主題，其中一個羽毛），並逐步放慢應用程序爬行。要不斷添加D元素是必要的，因爲它是坐在屏幕角落的標誌的一部分，看起來像我可以做到的那樣美麗......

最終我來到了下面的解決方案，其關鍵是加載floatBG與600個虛擬UIComponents，然後與addDP函數的每個週期都添加一個移動d UIComponent到floatBG並從它包含的子數組中刪除另一個UIComponent。

因此，最終它看起來是這樣的：

<?xml version="1.0" encoding="utf-8"?><s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="init(event)"> 

<fx:Script> 
    <![CDATA[ 

     import mx.core.DesignLayer; 
     import mx.core.UIComponent; 
     import mx.effects.effectClasses.MoveInstance; 
     import mx.events.EffectEvent; 
     import mx.events.FlexEvent; 
     import mx.states.RemoveChild; 

     import spark.effects.AnimateColor; 
     import spark.effects.AnimateFilter; 
     import spark.effects.Fade; 
     import spark.effects.Move; 
     import spark.effects.Rotate; 
     import spark.effects.easing.Sine; 

     private var floatBG:UIComponent = new UIComponent; 

     private var floatColour:uint = 0x1C75BC 

     protected function init(event:FlexEvent):void 
     { 

      //Float BackGround set up 
      floatBG.mask = floatMaskBlock; 
      floatBG.depth = -1; 

      this.addElement(floatBG); 


      //Fill FloatBG with 600 filler elements 
       for(var i:int=0; i<600; i++) 
       { 
        var filler:UIComponent = new UIComponent; 
        floatBG.addChild(filler); 
       } 
      //Float Animation Timer 

      var floatTimer:Timer = new Timer(1,0); 
      floatTimer.addEventListener(TimerEvent.TIMER,DPstartup) 
      floatTimer.start(); 

     private function DPstartup(event:TimerEvent):void 
     { 
      this.addDP(5,60) 
      this.addDP(22,14); 
      this.addDP(18,18); 
     } 

     private function addDP(yf:Number,yt:Number):void 
     { 
      this.title.text = floatBG.numChildren.toString(); 

      var dY:Number = yf+Math.ceil(Math.random()*yt); 
      var dXby:Number = Math.ceil(Math.random()*1000 + 50); 
      var dSize:Number = Math.ceil(Math.random()*12); 
      var dAlpha:Number = Math.random()*0.5 + 0.2 
      var dMotionDuration:Number = Math.ceil(Math.random()*15000) + 1000; 
      var dFadeDuration:Number = Math.random()*dMotionDuration; 

      var d:UIComponent = new UIComponent; 

      d.graphics.beginFill(floatColour,dAlpha); 
      d.graphics.drawRect(78, dY, dSize,dSize); 
      d.graphics.endFill(); 

      var dMove:Move = new Move(d); 
      dMove.xBy = dXby; 
      dMove.duration = dMotionDuration; 
      dMove.easer = Linear; 

      dMove.play(); 

      var dFade:Fade = new Fade(d); 
      dFade.alphaFrom = dAlpha; 
      dFade.alphaTo = 0; 
      dFade.duration = dFadeDuration; 

      dFade.play(); 

      floatBG.addChild(d); 
      floatBG.removeChildAt(0); 
     }; 
    ]]> 
</fx:Script> 

<fx:Declarations>  
    <s:Sine id="Sine"/> 
    <s:Bounce id="Bounce"/> 
    <s:Linear id="Linear"/>  
</fx:Declarations> 

<s:Group x="88" width="1000" height="80" id="floatMaskBlock"> 
    <s:Rect width="100%" height="100%"> 
     <s:fill> 
      <s:SolidColor color="0xffffff"/> 
     </s:fill> 
    </s:Rect> 
</s:Group></s:Group> 

好，道歉，如果這是很囉嗦，但有人可能會發現它很有用...這是一個很好的效果（我是這麼認爲的無論如何）

我使用面具來給出d元素出現點的尖銳邊緣。或者，可以將它放在另一個對象的後面，但是如果像我的情況那樣，對象是一個寬度小於某些d元素的寬度的行，那麼這樣的掩碼是必需的。

顏色在開始時聲明爲一個變量，因爲我可能會添加一個函數來在點擊或其他類似的地方改變它。

謝謝！

Josh

Answer 2

我在Flex 4中跑了這一點，只改變我做是使用在UIComponent而不是一個spirte，工作正常的。也許你使用純粹的AS3項目呢？不知道他們玩後摧毀。

<?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:Script> 
     <![CDATA[ 
      import mx.core.UIComponent; 
      import mx.effects.Fade; 
      import mx.effects.Move; 

      private var floatBG:UIComponent = new UIComponent(); 

      private function addDP(event:TimerEvent):void{ 

       var dY:Number = 5+Math.ceil(Math.random()*60); 
       var dSize:Number = Math.ceil(Math.random()*12); 
       var dAlpha:Number = Math.random()*0.5 + 0.2 
       var dDuration:Number = Math.ceil(Math.random()*5000) + 1000; 

       var d:UIComponent = new UIComponent(); 
       d.graphics.beginFill(0x1C75BC,dAlpha); 
       d.graphics.drawRect(78, dY, dSize,dSize); 
       d.graphics.endFill(); 


       floatBG.addChild(d); 

       var dMove:Move = new Move(d); 
       dMove.xBy = 300; 
       dMove.duration = dDuration; 

       dMove.play(); 

       var dFade:Fade = new Fade(d); 
       dFade.alphaFrom = 1; 
       dFade.alphaTo = 0; 
       dFade.duration = dDuration; 

       dFade.play(); 

       this.addElement(floatBG); 

      } 

      private function onClick():void{ 
       var t:Timer = new Timer(100, 10); 
       t.start(); 
       t.addEventListener(TimerEvent.TIMER, addDP); 
      } 

     ]]> 
    </fx:Script> 

    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 
    <s:Button click="onClick()" /> 
</s:Application>