4 Replies Latest reply on Jan 10, 2008 2:18 PM by dazweeja

    ViewStack not working

    kilyas2007
      This is really drawing me crazy, since I have been trying to fix it for a long time but in vain. I have the following piece of code:-

      quote:

      <mx:ViewStack id="vs1" width="100%" height="100%">

      <mx:VBox id="chartBox1" width="100%" height="100%" icon="@Embed('../assets/icon_grid.png')"
      toolTip="View in Grid" hideEffect="Fade" showEffect="Fade">

      <mx:DataGrid id ="dg" width="100%" height="100%"
      sortableColumns="true" dataProvider="{_secTypes}" >
      <mx:columns>
      <mx:DataGridColumn headerText="Sec Type" dataField="{CcmConstants.NAME}"/>
      <mx:DataGridColumn headerText="header" dataField="exposure"
      textAlign="right"/>
      </mx:columns>
      </mx:DataGrid>

      </mx:VBox>
      <mx:VBox id="gridBox1" width="100%" height="90%" icon="@Embed('../assets/icon_pie.png')"
      toolTip="View in Chart" hideEffect="Fade" showEffect="Fade">

      <mx:PieChart x="0" y="20" id="riskTypeChart" width="100%" height="100%" dataProvider="{_secTypes}" itemClick="pieChartClick(event)">
      <mx:series>
      <mx:PieSeries labelPosition="callout" field="exposure" labelFunction="display"/>
      </mx:series>
      </mx:PieChart>

      </mx:VBox>
      </mx:ViewStack>


      Unfortunately I have tried everything in my power but it would not display the stack. It would only display the first one, if the first one is piechart, it displays only the piechart, if I change the order and move grid above piechart, then it only displays the grid. Please advise
        • 1. Re: ViewStack not working
          dazweeja Level 1
          How are you trying to switch between the views of the stack? Do you have buttons that you haven't included in this code snippet? For example:

          <mx:Button id="searchButton" label="DataGrid" click="vs1.selectedChild=chartBox1;"/>
          <mx:Button id="cInfoButton" label="PieChart" click="vs1.selectedChild=gridBox1;"/>

          See the example at the bottom of this page:

          http://livedocs.adobe.com/flex/201/langref/mx/containers/ViewStack.html

          Cheers,
          Darren.

          • 2. Re: ViewStack not working
            kilyas2007 Level 1
            quote:

            Originally posted by: dazweeja
            How are you trying to switch between the views of the stack? Do you have buttons that you haven't included in this code snippet? For example:

            <mx:Button id="searchButton" label="DataGrid" click="vs1.selectedChild=chartBox1;"/>
            <mx:Button id="cInfoButton" label="PieChart" click="vs1.selectedChild=gridBox1;"/>

            See the example at the bottom of this page:

            http://livedocs.adobe.com/flex/201/langref/mx/containers/ViewStack.html

            Cheers,
            Darren.




            By using the following lines in code posted previously:-

            <mx:VBox id="chartBox1" width="100%" height="100%" icon="@Embed('../assets/icon_grid.png')"
            toolTip="View in Grid" hideEffect="Fade" showEffect="Fade">

            and

            <mx:VBox id="gridBox1" width="100%" height="90%" icon="@Embed('../assets/icon_pie.png')"
            toolTip="View in Chart" hideEffect="Fade" showEffect="Fade">
            • 3. Re: ViewStack not working
              paulfeuer
              dazweeja is correct - a ViewStack only shows one component at a time.

              you need something to switch the selectedIndex property of the viewStack

              to get your stack to ONLY display the SECOND component, do this:

              <mx:ViewStack id="vs1" width="100%" height="100%" selectedIndex="1">

              ./paul
              • 4. Re: ViewStack not working
                dazweeja Level 1
                Specifying an icon doesn't automatically create some sort of clickable control but it will add an icon to an associated control if one exists. Maybe you want to use a TabNavigator, which is a special type of ViewStack. That way the icon that you have specified will appear in the TabBar of the TabNavigator.

                Cheers,
                Darren.