4 Replies Latest reply on Nov 12, 2009 12:32 PM by mouryach

    Multiple ViewStacks question

    mouryach

      Hello, i just started working with Flex. I have a basic question which i didnt find answer yet.

       

      How can i use multiple viewstacks ? what i want is.. I have a linkbar when i click a link it should display some content on the canvas. This is done through viewstack and linkbar. Now when i click the link i want to add more sub links so that clicking the sub links should change the content on the canvas. I am not able to figure out how i can achieve this

        • 1. Re: Multiple ViewStacks question
          Flex harUI Adobe Employee

          Viewstacks switch between child containers.  If you are trying to modify a single container, consider using states

           

          Alex Harui

          Flex SDK Developer

          Adobe Systems Inc.

          Blog: http://blogs.adobe.com/aharui

          • 2. Re: Multiple ViewStacks question
            mouryach Level 1

            I wrote some thing like

             

             

            <mx:viewstack>

             

                 <mx:canvas>

             

                      <mx:button click="test.text='change';" />

                      <mx:label id="test" text="no change" />

             

                 </mx:canvas>

            </mx:viewstack>

             

             

            This changes the label from "no change" to "change". But, i was wondering, whether  1) i can change the label back to "no change" and 2) This type of code is good.

             

            I can use viewstates but, i want to achieve this through viewstack

            • 3. Re: Multiple ViewStacks question
              Gregory Lafrance Level 6

              If this post answers your question or helps, please mark it as such.

               

              You could show the sub-links by using a Canvas, and having the secondary linkbars have the same x, y position.

               

              Then as each of the primary links are clicked, set the appropriate secondary linkbar "visible" property to true.

               

              Here is some code that answers your question:

               

              <?xml version="1.0" encoding="utf-8"?>
              <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" horizontalAlign="center">
                <mx:Script>
                  <![CDATA[
                    import mx.controls.Alert;
                    import mx.events.ItemClickEvent;
                    import mx.collections.ArrayCollection;
                    
                    [Bindable] private var primaryAC:ArrayCollection = new ArrayCollection([
                      "PrimaryOne",
                      "PrimaryTwo"
                    ]);
                    [Bindable] private var secondaryOneAC:ArrayCollection = new ArrayCollection([
                      "SecondaryOneOne",
                      "SecondaryOneTwo",
                      "SecondaryOneTwo"
                    ]);
                    [Bindable] private var secondaryTwoAC:ArrayCollection = new ArrayCollection([
                      "SecondaryTwoOne",
                      "SecondaryTwoTwo",
                      "SecondaryTwoTwo"
                    ]);
                    
                    private function clickFuncOne(evt:ItemClickEvent):void{
                      switch(evt.label){
                        case "PrimaryOne":
                          secondaryOneLB.visible = true;
                          secondaryTwoLB.visible = false;
                          break;
                        case "PrimaryTwo":
                          secondaryTwoLB.visible = true;
                          secondaryOneLB.visible = false;
                          break;
                      }
                    }
                    
                    private function clickFuncTwo(evt:ItemClickEvent):void{
                      mx.controls.Alert.show(evt.label);
                    }
                  ]]>
                </mx:Script>
                <mx:LinkBar dataProvider="{primaryAC}" itemClick="clickFuncOne(event);"/>
                <mx:Canvas width="100%">
                  <mx:LinkBar id="secondaryOneLB" visible="false" horizontalCenter="0"
                    itemClick="clickFuncTwo(event);" y="40" dataProvider="{secondaryOneAC}"/>
                  <mx:LinkBar id="secondaryTwoLB" visible="false" horizontalCenter="0"
                    itemClick="clickFuncTwo(event);" y="40" dataProvider="{secondaryTwoAC}"/>
                </mx:Canvas>
              </mx:Application>
              
              
              1 person found this helpful
              • 4. Re: Multiple ViewStacks question
                mouryach Level 1

                Thanks, your code is what i was looking for. But, i was wondering that this functionality can be achieved easily in HTML. But why it is not possible in Flex without using the actionscript. I think we can do this with viewstates but, it is good only when we have few tranistions.