1 Reply Latest reply on Aug 6, 2010 5:50 PM by Adam York

    Transition between states not working

    Adam York Level 1

      hey everyone , struggling trying to figure out why this isnt working. When i change the state from inactive to active , or vice versa , nothing happens. Any Ideas?

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:SkinnableContainer xmlns:fx="http://ns.adobe.com/mxml/2009"
                 xmlns:s="library://ns.adobe.com/flex/spark"
                 xmlns:mx="library://ns.adobe.com/flex/mx"
                 xmlns:comp="dev.portfolio.view.components.*"
                 xmlns:portfolio="dev.portfolio.*"
                 width="100%"
                 height="100%"
                 currentState="inactive">
                
          <fx:Script>
              <![CDATA[

       

                  private var _stageHeight          : Number;
                  private var _interpolatedHeight : Number;
                 
                  public function set stageHeight( value : Number ) : void {
                      _stageHeight = value;
                  };
                 
                  public function set interpolatedHeight( value : Number ) : void {
                      _interpolatedHeight = value;
                  };
                 
                  [Bindable]
                  public function get stageHeight() : Number {
                      return _stageHeight;
                  };
                 
                  [Bindable]
                  public function get interpolatedHeight() : Number {
                      return _interpolatedHeight;
                  };
                 
              ]]>
         </fx:Script>
        
         <s:layout>
             <s:BasicLayout/>
         </s:layout>
                
          <s:states>
              <s:State name="active"/>
              <s:State name="inactive"/>
          </s:states>
         
          <s:transitions>
              <s:Transition fromState="active" toState="inactive">
                  <s:Move duration="1" target="{blade}"  yTo="{stageHeight}" />
             </s:Transition>
             <s:Transition fromState="inactive" toState="active">
                  <s:Move duration="1" target="{blade}"  yTo="{interpolatedHeight}" />
             </s:Transition>
          </s:transitions>

       

          <comp:ContentBlade width="100%"
                             height="200"
                             id="blade"
                             skinClass="dev.portfolio.view.skins.ContentBladeSkin"/>
      </s:SkinnableContainer>

        • 1. Re: Transition between states not working
          Adam York Level 1

          lol. I reworked the transitions. All is resolved , solution below.

           

          <fx:Declarations>
                  <s:Power id="bladeEase" easeInFraction=".1"/>
              </fx:Declarations>

           

          <s:transitions>
                  <s:Transition toState="active" autoReverse="false">
                      <s:Move duration="800" target="{blade}"
                              yTo="{interpolatedHeight}" easer="{bladeEase}"
                              effectEnd="blade.y=interpolatedHeight"/>
                 </s:Transition>
                 <s:Transition toState="inactive" autoReverse="false">
                      <s:Move duration="800" target="{blade}"
                              yTo="{stageHeight}" easer="{bladeEase}"
                              effectEnd="blade.y=stageHeight" />
                 </s:Transition>
              </s:transitions>