1 Reply Latest reply on Aug 25, 2009 11:49 AM by David_F57

    Repurposing transitions for multiple objects?

    Handycam Level 1

      I have an application where I have several RichText object which only display "help text" in a state designed to show them:

       

      <s:RichText id="help1aText"  text="{helpData..step.(@number=='1a')}" includeIn="help1a"/>
      
      

       

      There is a button next to each of the "steps" in the application that toggles the state:

       

      private function toggleHelp(event:MouseEvent):void {
           var help:String = event.currentTarget.id;
           if (this.currentState != help){
             this.currentState = help;
           } else {
             this.currentState = "normal";
              }
      }
      
      

       

      OK, fine.  Now I would like to add a resize transition for each of these item's parent containers to have it "grow" to show this text instead of it just popping on.  I can easily do this with transitiosn:

       

      <s:transitions>
           <s:Transition fromState="normal" toState="help1a">
                <s:Parallel>
                     <s:Resize duration="500" target="{question1}" />
                     <s:Fade duration="500" target="{help1aText}" />
                </s:Parallel>
           </s:Transition>
           <s:Transition fromState="help1a" toState="normal">
                <s:Parallel>
                     <s:Fade duration="500" target="{help1aText}" />
                     <s:Resize duration="500" target="{question1}" />
                </s:Parallel>
           </s:Transition>
      </s:transitions>
      
      

       

      But it would be nuts to do one of these transition pairs for each and every one of the objects, to specify the targets.

       

      How could I create one pair of transitions that would work for ANY of the help states and target the appropriate objects?

        • 1. Re: Repurposing transitions for multiple objects?
          David_F57 Level 5

          you don't even need to duplicate the transitions

           

          firstly target the transition with bindable values oldstate and newstate  (set these in your toggle function)

           

          then target the objects the same way with  values oldobject and currentobject (set these values where ever you select the object)

          i.e : oldobject=newobject

                 newobject=currentTarget

           

           

               <s:Transition fromState="{oldstate}" toState="{newstate}">
                    <s:Parallel>
                         <s:Resize duration="500" target="{oldobject}" />
                         <s:Fade duration="500" target="{newobject}" />
                    </s:Parallel>
               </s:Transition>

           

           

          David