好了,有點玩了後我設法找到一個解決方案,我真的很感激布萊恩·畢曉普的幫助下,誰管理,很多點我在正確的方向。
布賴恩建議,只需輸入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
我會認爲問題出在Move類中。你可以發佈嗎? – longstaff 2011-02-08 08:52:45
@shortstick:Move是一個Flex框架類,不是自定義的。 – Ryan 2011-02-08 10:22:15