1 Reply Latest reply on May 25, 2007 4:19 PM by peterent

    Panel Transition Problem

    BigQuiver Level 1
      Hey All,

      I am having problems applying transitions on my custom components. So I decided to start from scratch with a stock panel component and apply a transition to that then work my way up. Unfortunately I can't even get that to work. Here is my code for the panel and its transition... really basic but it just isn't working. The panel simply dissapears without the fade effect. Any pointers?

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

      <mx:states>
      <mx:State name="state2">
      <mx:RemoveChild target="{panel1}"/>
      <mx:SetEventHandler target="{button1}" name="click" handler="currentState=''"/>
      </mx:State>
      </mx:states>

      <mx:transitions>
      <mx:Transition fromState="" toState="state2">
      <mx:Fade duration="1000" target="{panel1}"/>
      </mx:Transition>
      </mx:transitions>

      <mx:Panel width="250" height="200" layout="absolute" id="panel1">
      </mx:Panel>
      <mx:Button label="Change State" click="currentState='state2'" id="button1"/>

      </mx:Application>
        • 1. Re: Panel Transition Problem
          peterent Level 2
          The problem is the RemoveChild in the state. When you change the state it immediately executes the RemoveChild and boom, your Panel is gone.

          Do you really want to remove the Panel in the new state? That's OK, but if you don't need to remove it, don't bother. But let's assume you do, what you want the transition to do is fade out the Panel and THEN remove it. I think this will work:

          <mx:transitions>
          <mx:Transition fromState="" toState="state2">
          <mx:Sequence>
          <mx:Fade duration="1000" target="{panel1}"/>
          <mx:RemoveChildAction target="{panel1}" />
          </mx:Sequence>

          </mx:Transition>
          </mx:transitions>

          The Sequence effect will first run the fade, then it will remove the Panel.