0 Replies Latest reply on Aug 4, 2010 9:01 AM by flairjax

    View stack navigation container not expanding

    flairjax

      So I have a viewstack with navigationContent and when the viewstacks are shown the state is changed. My viewstacks states make the viewstack resize or should.  But when I go to a specific state and show the last navigationContent in the viewStack the navigationContent doesn't seem to resize so my datagrid in the navigationContent is cut off.  I have tried calling invalidateSize on everything in hopes of forcing it but nothing happens.  The only way I can get it to resize is click the other tabs in my tabbar to and after about four or five switches between navigationContents the one with the datagrid will finally be the correct size.  CODE BELOW.

       

       

      <s:states>
              <s:State name="min"/>
              <s:State name="max"/>
              <s:State name="xmax"/>
          </s:states>
         
          <s:transitions>
              <s:Transition fromState="min" toState="max" autoReverse="true">
                  <s:Resize target="{vstack}" duration="100"/>
              </s:Transition>
              <s:Transition fromState="max" toState="min" autoReverse="true">
                  <s:Resize target="{vstack}" duration="100"/>
              </s:Transition>
              <s:Transition fromState="*" toState="xmax" autoReverse="true">
                  <s:Resize target="{vstack}" duration="100"/>
              </s:Transition>
          </s:transitions>

       

      <s:TabBar id="tBar"
                    y="10"
                    left="4"
                    skinClass="assets.style.skins.CustomSparkTabBarSkin"
                    horizontalCenter="0"
                    dataProvider="{vstack}"
                    requireSelection="true"
                    mouseEnabled="true"
                    useHandCursor="true"
                    mouseChildren="true"
                    >
          </s:TabBar>
          <mx:ViewStack id="vstack" y="27" left="-1" borderStyle="none" width="100%" height="195" >
              <s:NavigatorContent id="label" label="Summary" show="showMaxState()" >
                  <components:SummaryTab dataPayLoad="{tabData}" />
              </s:NavigatorContent>
             
              <s:NavigatorContent id="Timeline" label="Timeline" show="showMaxState(); timelineShown();" width="250" >
                  <components:TimelineTab dataPayLoad="{timelineData}" x="4" y="10"/>
              </s:NavigatorContent>
             
              <s:NavigatorContent id="Network" label="Network" show="showMaxState(); networkShown();" >
                  <components:NetworkTab initStateLeaf="false" dataPayLoad="{inoutData}" />
              </s:NavigatorContent>
             
              <s:NavigatorContent id="Ports"
                                  label="Ports"
                                  show="showXMaxState(); portmapShown();"
                                  width="500" minWidth="500"
                                  initialize="Ports.invalidateSize(); datagrid.invalidateSize(); " >
                      <components:NonSelectedableDataGrid
                          xmlns:fx="http://ns.adobe.com/mxml/2009"
                          xmlns:s="library://ns.adobe.com/flex/spark"
                          xmlns:mx="library://ns.adobe.com/flex/mx"
                          id="datagrid" alpha="1"
                          borderAlpha="0"
                          top="0"
                          width="500" height="200"
                          dataProvider="{portMapData}"
                          headerHeight="35"
                          >
                          <components:columns>
                              <!--<mx:DataGridColumn dataField="type" />-->
                              <mx:DataGridColumn dataField="name"
                                                 headerText="Name"
                                                 width="115"
                                                 showDataTips="true"
                                                 sortCompareFunction="doSortOnName"
                                                 >
                                  <!--sortCompareFunction="doSortOnName"-->
                                  <mx:itemRenderer>
                                      <fx:Component>
                                          <mx:LinkButton
                                              styleName="callOutHeader"
                                              creationComplete="initLinkButton(event);"
                                              color="#000000"
                                              maxWidth="270"
                                              label="{data.ip_address}"
                                              labelPlacement="right"
                                              toolTip="IP Adress : {data.ip_address}"
                                              left="5"
                                              rollOver="handleRollOver(event)"
                                              rollOut="handleRollOut(event)"
                                              >
                                              <fx:Script><![CDATA[
                                                 
                                                  import mx.controls.DataGrid;
                                                  import mx.events.ListEvent;
                                                  import mx.controls.Image;
                                                 
                                                  import com.sdfd.blaj.utils.Images;
                                                 
                                                  private var _linkButtonsData:Object;
                                                 
                                                  public function handleLinkButtManClick(e:Event):void{
                                                      var d:Number = data.device_id;
                                                      if( !isNaN(d) ){
                                                          var dstr:String = String(d);
                                                          navigateToURL( new URLRequest( '/inventory/devices/' + dstr ), '_self' );
                                                      }else{
                                                          return;
                                                      }
                                                  }
                                                 
                                                  private function fetchIcon() : Image
                                                  {
                                                      var img:Class;
                                                      img = Images.resource_single( String(data.device).toLowerCase() );
                                                     
                                                      var returnImage:Image = new img ();
                                                      return returnImage;
                                                     
                                                  }
                                                 
                                                 
                                                  private function initLinkButton(e:Event) : void
                                                  {
                                                      var nl:LinkButton;
                                                      var id:String = data.device_id;
                                                      e.target is LinkButton ?  nl = LinkButton(e.target) : null;
                                                      if( nl != null && id != '' ){
                                                          //trace(e.target.data.name);
                                                          _linkButtonsData = e.target.data;
                                                          this.addEventListener( MouseEvent.CLICK, handleLinkButtManClick );
                                                      }
                                                     
                                                  }
                                                 
                                                 
                                                  public function handleRollOver(event:Event) : void {
                                                      var did:Number = _linkButtonsData.device_id;
                                                      !isNaN(data.device_id) ? event.target.setStyle('textDecoration', 'underline') : event.target.setStyle('textDecoration', 'none')
                                                  }
                                                 
                                                  public function handleRollOut(event:Event) : void {
                                                      event.target.setStyle('textDecoration', 'none')
                                                  }
                                              ]]></fx:Script>
                                          </mx:LinkButton>
                                      </fx:Component>
                                  </mx:itemRenderer>
                              </mx:DataGridColumn>
                              <mx:DataGridColumn dataField="port" headerText="port #" width="75">
                                  <mx:itemRenderer>
                                      <fx:Component>
                                          <mx:Label
                                              text="{data.port}"
                                              maxWidth="45"
                                              truncateToFit="true"
                                              paddingLeft="1"
                                              >
                                          </mx:Label>
                                      </fx:Component>
                                  </mx:itemRenderer>
                              </mx:DataGridColumn>
                              <mx:DataGridColumn dataField="vlan" headerText="vlan" width="100">
                                  <mx:itemRenderer>
                                      <fx:Component>
                                          <mx:Label
                                              text="{data.vlan}"
                                              maxWidth="80"
                                              truncateToFit="true"
                                              paddingLeft="1"
                                              >
                                          </mx:Label>
                                      </fx:Component>
                                  </mx:itemRenderer>
                              </mx:DataGridColumn>
                              <mx:DataGridColumn dataField="inbytes" headerText="In(Bps)" width="70" sortCompareFunction="doSortOnInBytes"/>
                              <mx:DataGridColumn dataField="outbytes" headerText="Out(Bps)" width="70" sortCompareFunction="doSortOnOutBytes"/>
                          </components:columns>
                      </components:NonSelectedableDataGrid>
              </s:NavigatorContent>
             
          </mx:ViewStack>