4 Replies Latest reply on Sep 27, 2010 5:43 PM by Devtron

    TabNavigator cannot hide children, why?

    Devtron Level 3

      Here is my code:

              <mx:TabNavigator id="tn2" width="100%" height="100%" >
                  <mx:Form id="form1" label="form1" visible="true" >
                     
                  </mx:Form>
                  <mx:Form id="form2" label="form2" visible="false" >
                     
                  </mx:Form>           
              </mx:TabNavigator>

       

      Here is the result:

      tabNavigator-screenshot.png

       

      Why is form2 always visible?

        • 1. Re: TabNavigator cannot hide children, why?
          Flex harUI Adobe Employee

          TabNavigator uses the visible property to hide/show the children.

          • 2. Re: TabNavigator cannot hide children, why?
            Devtron Level 3

            I ended up doing this:

                        private function hideAllTabsHack():void {
                            for (var i:int=0; i < tn.length; i++){
                                var x:mx.controls.Button;
                                x = tn.getTabAt(i);
                                x.visible=false;
                                x.includeInLayout=false;
                            }
                        }

             

             

            but I would think it would be easier to hide tab children? I think it's confusing. I have up to 26 tabs, and I do not need all of them hidden, they need to be dynamic. What a pain in the ***.

            • 3. Re: TabNavigator cannot hide children, why?
              Devtron Level 3

              I still need to reference the tabs by name. FLEXHARUI, any idea how to do that?

               


              I need to do something like this:

                              for (var i:int=0; i < tabCount; i++){           
                                  var x:mx.controls.Button;
                                  x = tn.getTabByName("A");
                                  x.visible=true;
                                  x.includeInLayout=true;
                              }

               

              except, getTabByName isnt available. How else can I reference my tabs by name?

               

               

              Here is my tabNavigator definition:

               

               

                              <mx:TabNavigator id="tn" width="100%" height="100%"
                                               styleName="myTabStyle"
                                               creationComplete="hideAllSchedulingTabsHack()"
                                               >
                                  <mx:Form id="A" label="very blue" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="B" label="red" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="C" label="yellow" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="D" label="neon green" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="E" label="blue" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="F" label="light blue" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="G" label="magenta" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="H" label="green" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="I" label="orange" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="J" label="pink" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="K" label="brown olive" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="L" label="olive" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="M" label="purple" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="N" label="light yellow" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="O" label="dark green" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="P" label="peach" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="Q" label="light purple" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="R" label="burnt orange" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="S" label="dark red" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="T" label="oatmeal" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="U" label="split pea" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />   
                                  <mx:Form id="V" label="pinkpurple" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />
                                  <mx:Form id="W" label="bluegrey" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />
                                  <mx:Form id="X" label="crimson red" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />
                                  <mx:Form id="Y" label="wine red" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />
                                  <mx:Form id="Z" label="light purple" hideEffect="{hideEffect}" showEffect="{showEffect}" visible="false" />
                                 
                              </mx:TabNavigator>

              • 4. Re: TabNavigator cannot hide children, why?
                Devtron Level 3

                I now realize that I should be using tabBar and not tabNavigator.

                 

                tabNavigator is not my friend.