Flex - Lecture de l'effet de redimensionnement sur le parent avant l'ajout d'un enfant

Question

J'ai un panneau avec un bouton. En cliquant sur le bouton, le panneau indiquera "State2" en ajoutant deux autres boutons dans le panneau. Pendant le changement d'état, je veux que le panneau se redimensionne d'abord puis affiche les deux nouveaux boutons ajoutés, donc j'ai appliqué des transitions sur le changement d'état.

Ma question est:

Si je mets les deux boutons dans un HBox directement sous l'étiquette addChild, il fonctionne très bien. Cependant, si je crée un nouveau composant avec le même code (HBox avec deux boutons dedans) et ensuite j'ajoute le nouveau composant au panneau (Comp dans le code commenté), il ne montrera pas l'effet de redimensionnement.

Quelqu'un pourrait me dire comment résoudre ce problème? Merci d'avance.

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*"> 

    <mx:Script> 
     <![CDATA[ 
      protected function button1_clickHandler(event:MouseEvent):void 
      { 
       currentState="State2"; 
      } 
     ]]> 
    </mx:Script> 

    <mx:transitions> 
     <mx:Transition> 
      <mx:Sequence targets="{[comp,panel1]}"> 
       <mx:Resize target="{panel1}" /> 
       <mx:AddChildAction /> 
      </mx:Sequence> 
     </mx:Transition> 
    </mx:transitions> 

    <mx:states> 
     <mx:State name="State2"> 
      <mx:AddChild relativeTo="{panel1}" position="lastChild"> 
       <mx:HBox id="comp"> 
        <mx:Button label="B" /> 
        <mx:Button label="C" /> 
       </mx:HBox> 
       <!--<local:Comp id="comp" />--> 
      </mx:AddChild> 

     </mx:State> 
    </mx:states> 

    <mx:Panel layout="horizontal" borderThickness="1" borderStyle="solid" id="panel1" title="AB"> 
     <mx:Button label="A" click="button1_clickHandler(event)"/> 
    </mx:Panel> 
</mx:Application> 

Answer 1

Je suppose que <mx:AddChild> peut gérer un seul composant à la fois.

Vous obtiendrez votre effet Resize doux si vous séparez votre composant personnalisé à une autre balise <mx:AddChild>, similaire au code ci-dessous:

<mx:AddChild relativeTo="{panel1}" position="lastChild"> 
     <mx:HBox id="comp"> 
      <mx:Button label="B" /> 
      <mx:Button label="C" /> 
      <!-- Don't put your custom component here. --> 
     </mx:HBox> 
</mx:AddChild> 
<!-- Use separated AddChild. Still add to same relativeTo object -->   
<mx:AddChild relativeTo="{panel1}" position="lastChild"> 
    <local:Comp id="comp2" /> 
</mx:AddChild> 

J'espère que vous avez obtenu ce que vous voulez.