這個Flex 4 Transition爲什麼不起作用？

Question

我有一個測試應用程序here這是使用下面的代碼製作：

<fx:Script> 
    <![CDATA[ 

      public function comboBoxHandler():void{ 
       var selectedItem:String = showComboBox.selectedItem; 

       if(selectedItem == "All results"){ 
        currentState = "default"; 
        return; 
       }else if(selectedItem == "Only results within tags"){ 
        currentState = "tagInput"; 
        return; 
       } 
      } 

    ]]> 
</fx:Script>  
<s:states> 
    <s:State name="default"/> 
    <s:State name="tagInput"/> 
</s:states> 
<s:transitions> 
    <s:Transition id="showTagTextInput" fromState="default" toState="tagInput"> 
     <s:Sequence id="t1p1" targets="{[tagsLabel,tagsTextInput,GoButton]}"> 

      <s:Move duration="700"/> 
      <s:Fade duration="400"/> 

     </s:Sequence> 
    </s:Transition> 
    <s:Transition id="hideTagTextInput" fromState="tagInput" toState="default"> 
     <s:Sequence id="t2p1" targets="{[tagsLabel,tagsTextInput,GoButton]}" > 

      <s:Fade duration="400"/> 
      <s:Move duration="700"/> 

     </s:Sequence> 
    </s:Transition> 

</s:transitions> 

<s:Label x="136" y="13" width="120" height="34" fontFamily="Arial" fontSize="15" 
      text="Lessons&#xd;Learnt" textAlign="center"/> 

    <s:Group id="group" width="100%" height="100%" 
      x.default="0" y.default="55" width.default="400" height.default="231" 
      y.tagInput="55" height.tagInput="256"> 
     <s:Label x="45" y="38" width="50" height="22" text="Search" textAlign="center" 
       verticalAlign="middle"/> 
     <s:TextInput x="103" y="38" width="193" 
        useHandCursor.tagInput="false"/> 
     <s:Label x="45" y="89" width="51" height="22" text="Show" textAlign="center" 
       verticalAlign="middle"/> 
     <s:Button id="GoButton" x="253" y="137" width="43" label="Go" useHandCursor="true" 
        buttonMode="true" mouseChildren="false" 
        x.tagInput="254" y.tagInput="188"/> 
     <s:DropDownList id="showComboBox" x="104" y="89" width="192" change="comboBoxHandler();" 
        selectedIndex="0"> 
      <s:ArrayCollection> 
       <fx:String>All results</fx:String> 
       <fx:String>Only results within tags</fx:String> 
      </s:ArrayCollection> 
     </s:DropDownList> 
     <s:Label id="tagsLabel" includeIn="tagInput" x="104" y="146" width="61" height="20" text="Tags" 
       textAlign="center" verticalAlign="middle"/> 
     <s:TextInput id="tagsTextInput" includeIn="tagInput" x="173" y="146" width="123"/> 

    </s:Group> 

您可以檢查，通過一下我給的鏈接，這個應用程序執行一些基本的過渡效果當您選擇不同的選項從DropDownBox。

第一個（顯示）轉換不能很好地工作，但第二個（隱藏）轉換確實有效。

有誰知道如何解決這個問題？在第一次過渡中，我希望該按鈕首先向下滑動，之後才應該使文本輸入淡入。 爲什麼不能正常工作？

在此先感謝。

Answer 1

指定特定效果目標比指定<s:Sequence />中的所有目標更好。因此，請將目標設置爲<s:Move />和<s:Fade />。您還可以通過將<s:AddAction />和<s:RemoveAction />與相應的目標放在一起，執行額外的轉換調整，以便在轉換應調用includeIn和excludeFrom狀態聲明的順序內指定一個位置。

所以這些轉變正常工作與你的代碼：

<s:transitions> 
    <s:Transition fromState="default" id="showTagTextInput" toState="tagInput"> 
     <s:Sequence id="t1p1"> 
      <s:Move duration="700" targets="{[GoButton]}" /> 
      <s:AddAction targets="{[tagsLabel,tagsTextInput]}" /> 
      <s:Fade duration="400" targets="{[tagsLabel,tagsTextInput]}" /> 
     </s:Sequence> 
    </s:Transition> 
    <s:Transition fromState="tagInput" id="hideTagTextInput" toState="default"> 
     <s:Sequence id="t2p1"> 
      <s:Fade duration="400" targets="{[tagsLabel,tagsTextInput]}" /> 
      <s:RemoveAction targets="{[tagsLabel,tagsTextInput]}" /> 
      <s:Move duration="700" targets="{[GoButton]}" /> 
     </s:Sequence> 
    </s:Transition> 
</s:transitions> 

Answer 2

我猜想那是因爲只被包含在tagInput狀態的標籤輸入，而阿爾法是100％，還有的國家之間沒有過渡。試試這個：

<s:Label id="tagsLabel" alpha.default="0" alpha.tagInput="100" x="104" y="146" width="61" height="20" text="Tags" textAlign="center" verticalAlign="middle"/> 
<s:TextInput id="tagsTextInput" alpha.default="0" alpha.tagInput="100" x="173" y="146" width="123"/> 

您可能還想在'默認'狀態期間將visible設置爲false。另外，Constantiner說的是真實的。