2 Replies Latest reply on Apr 27, 2010 10:08 PM by -skitch-

    "Screen" navigation not working in Flex 4 with ViewStack

    JPatlovany

      I had started using Flex 3 and made a little application that navigated from "screen" to "screen" without showing any tabs, panels, etc. using a viewstack that contained several references to canvas components I had made in separate mxml files.  I was setting the selectedChild during creationComplete of the app and then changing the selectedChild on button press events from the different canvas components.  Now that I have tried to upgrade to Flash Builder 4, I cannot get my application to work.  First off, it seems that "Canvas" has gone away and we are using "Groups" now, so I switched all that over.  But then, it also seemed that the content of a viewstack has also changed, so I cannot set my selectedChild to a group without casting to a Container first, but I had issues with that as well.

       

      Basically, I'd like to keep my old code, but I'm not that attached to it.  I will gladly start over if someone can tell me how to do "Screen/page" navigation with Flash Builder 4.  In the end, I basically want an AIR application that has multiple screens and no title bars, and the navigation is driven by the users selecting different buttons on the screen (which I do not want displaying on all screens like the ButtonBar, I want each screen to be completely different and custom).  How should I do this?

       

      Here is some sample code of how I was doing it with Flex 3:

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*" layout="absolute" creationComplete="onCreationComplete()" showFlexChrome="false">

       

          <mx:Script>
              <![CDATA[

       

                  private function onStartTask1():void
                  {
                      //...

                  }

                  private function onShowMainMenu():void
                  {
                      myViewStack.selectedChild = mainMenuScreen;
                  }

                  private function onCreationComplete():void
                  {
                      myViewStack.selectedChild = welcomeScreen;
                  }

              ]]>
          </mx:Script>

       

          <!-- adding an empty canvas allows the 'show' property to fire on the children -->
          <mx:ViewStack id="myViewStack" height="100%" width="100%">
                  <mx:Canvas id="emptyCanvas" />
                  <local:Welcome id="welcomeScreen" showMainMenu="onShowMainMenu()" />
                  <local:MainMenu id="mainMenuScreen" startTask1="onStartTask1()" />
                  <!--  ...   -->
          </mx:ViewStack>
               
      </mx:WindowedApplication>