6 Replies Latest reply on Oct 31, 2007 5:56 AM by peterent

    how to insert an item between two components

    lucky_raga Level 1
      Hi,

      I have two links one below the other, say suppose i click the first link, i have to display
      a list box right under it and push the second link below this newly formed list box.

      Please suggest how to go about it.

      Thanks,
      Lakshminarayan
        • 1. Re: how to insert an item between two components
          atta707 Level 2
          Please read thru the concept of states. Essentially, clicking on the fist like would switch to a new state that would use addChild to add this list box.

          something like: (right from the Flex Builder help)

          <mx:states>
          <mx:State name="Register">
          <mx:AddChild relativeTo="{loginForm}" position="lastChild">
          <mx:target>
          <mx:FormItem id="confirm" label="Confirm:">
          <mx:TextInput/>
          </mx:FormItem>
          </mx:target>
          </mx:AddChild>
          <mx:SetProperty target="{loginPanel}" name="title" value="Register"/>
          <mx:SetProperty target="{loginButton}" name="label" value="Register"/>
          <mx:SetStyle target="{loginButton}"
          name="color" value="blue"/>
          <mx:RemoveChild target="{registerLink}"/>
          <mx:AddChild relativeTo="{spacer1}" position="before">
          <mx:target>
          <mx:LinkButton id="loginLink" label="Return to Login" click="currentState=''"/>
          </mx:target>
          </mx:AddChild>
          </mx:State>
          </mx:states>

          ATTA
          • 2. Re: how to insert an item between two components
            peterent Level 2
            Place your LinkButtons in a VBox. This keeps them in a column. When you want to insert a List do something like this (assuming vbox is the id of the VBox):

            vbox.addChildAt( list, vbox.getChildIndex(linkButtonThatWasClicked)+1 );

            If you have 2 LinkButtons, the first has an index of 0, the second has an index of 1. If the first LinkButton is clicked, then the ListBox is inserted at position 1, making the second LinkButton now have an index of 2.

            Because the items are in a VBox you don't have to worry about positioning the List.
            • 3. Re: how to insert an item between two components
              lucky_raga Level 1
              Hi Peter,

              Thanks, this looks a simple and straightforward approach but how about using flex states as described
              by ATTA in this thread...any advantages of one above the other...
              • 4. Re: how to insert an item between two components
                atta707 Level 2
                I think what Peter has done here is answer your question "technically" something that's good to know.

                What I tried to do was to suggest a potential solution for problem generally.

                If you look into it, states would be doing some exactly like the snippet Peter has provided. But it's already done for you. Plus, states would give you much broader control on what to add/remove and to/from where. Moreover, states would give you the idea of transitions, that is, adding effects while switching from one state to another.

                my two cents, as usual.

                ATTA
                • 5. Re: how to insert an item between two components
                  lucky_raga Level 1
                  Hi ATTA,

                  I agree that flex states provides much better controll and a cleaner way of doing things.
                  Both seems to be potential sollutions to a simple porblem like mine.
                  But if the problem grows complex then according to my knowledge so far using view states
                  edges over other similar approaches.
                  Thnx
                  • 6. Re: how to insert an item between two components
                    peterent Level 2
                    You can certainly use states to insert the child into the VBox. Depends on what your goals are.