3 Replies Latest reply on Oct 12, 2009 3:19 AM by mordsm

    Changing order of dislpayed vbox/hbox

    mordsm Level 1

      Hi All

      I have a hbox container that contains vbox , hbox
      depending on a condition I want to change the order of the display

      How this thing can be done?


        • 1. Re: Changing order of dislpayed vbox/hbox
          Francisc Level 3



          To move children around use setChildIndex.

          So if you mean that you have a parent HBox container with 2 children another HBox and a VBox, you would have to do this:


          <mx:HBox id="parentHBox" ...>

             <mx:HBox id="childHBox" ...>...</mx:HBox>

             <mx:VBox id="childVBox" ...>...</mx:VBox>



          And the following ActionScript code you need to place in the IF statement or click action of the button that rearranges them:


          parentHBox.setChildIndex(childHBox,parentHBox.getChildIndex(childHBox) + 1);



          The above example moved the HBox child under the VBox.

          Note: You can use plus or minus operations, for example if you wanted to move the VBox over the HBox for the above MXML example you would write:


          parentHBox.setChildIndex(childVBox,parentHBox.getChildIndex(childVBox) - 1);

          • 2. Re: Changing order of dislpayed vbox/hbox
            kkc_mca Level 2

            I hope you are declaring VBox and HBox as MXML tags


            Declare those in the script tag and depending on the condition add the VBox and HBox to the container



            <?xml version="1.0" encoding="utf-8"?>

            <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" applicationComplete="init()">




            import mx.controls.Alert;


            public var myVBox:VBox;

            public var myHBox:HBox;


            public function init():void


            myVBox=new VBox();

            myHBox=new HBox();


            // need to perform the required action




            addChild(myVBox);  // first vbox

            addChild(myHBox);  // second hbox




            addChild(myHBox); // first hbox

            addChild(myVBox); // second vbox








            if this post answers your question or helps, Please mark it as such .

            1 person found this helpful
            • 3. Re: Changing order of dislpayed vbox/hbox
              mordsm Level 1

              while the abobe answers gave me nice insights /solutions I made another solution

              I changed the container to canvas and then using a condition I position my vbox /hbox like this

              <vbox ....... x = "{(condition?280:0}"