Flex animation question - apache-flex

Question

I am trying to do a simple animation. I want to fade in and resize a List inside creationcomplete. My problem is that I can alway see the element flash in before the element animation begin. On the other word, the user will see the element appear for 1 second->then fade in and resize animation. I was hoping anyone here could help me about it. thanks...
my code.
AS:
protected function compList_creationCompleteHandler(event:FlexEvent):void
{
compinfoResult.token = getCompList.compinfo();
compinfoResult.addEventListener(ResultEvent.RESULT, completeLoading);
function completeLoading(event:ResultEvent):void{
fadeList.play(); //the animation will fire when the List get the result from the server...
scaleList.play();
}
}
mxml
<s:Scale id="scaleList" scaleXFrom="0" scaleXTo="1" scaleYFrom="0"
scaleYTo="1" duration="500" target="{compList}" />
<s:Fade id="fadeList" alphaFrom="0" alphaTo="1" target="{compList}" />
<s:List id="compList"
width="280"
height="560"
x="0"
y="0"
alpha="0"
creationComplete="compList_creationCompleteHandler(event)"
itemRenderer="itemRenderer.compListItemRenderer"
change="compList_changeHandler(event)"/>

Answer 1

First off, I would combine these into a single transition, either in parallel or in sequence at your preference:
<s:Sequence id="effectSequence">
<s:Scale id="scaleList" scaleXFrom="0" scaleXTo="1" scaleYFrom="0"
scaleYTo="1" duration="500" target="{compList}" />
<s:Fade id="fadeList" alphaFrom="0" alphaTo="1" target="{compList}" />
</s:Sequence>
Then, I would not try to trigger this manually with an event. Use an effect instead, in this case I'd recommend the creationCompleteEffect.
<s:List id="compList"
width="280"
height="560"
x="0"
y="0"
alpha="0"
creationComplete="compList_creationCompleteHandler(event)"
itemRenderer="itemRenderer.compListItemRenderer"
change="compList_changeHandler(event)"
creationCompleteEffect="{effectSequence}"`/>