Question

Using the Tabbed View Navigator Application, I’ve set up a couple of pages.

<s:TabbedViewNavigatorApplication splashScreenImage="@Embed(source='images/loading.png')"
                              splashScreenScaleMode="letterbox"
                              backgroundColor="0xFFFFFF"
                              xmlns:fx="http://ns.adobe.com/mxml/2009" 
                              xmlns:s="library://ns.adobe.com/flex/spark" applicationDPI="240">
<s:ViewNavigator label="Main Menu" width="100%" height="100%" firstView="views.MainView" icon="@Embed(source='images/home.png')"/>
<s:ViewNavigator label="Flash Cards" width="100%" height="100%" firstView="views.FlashCardsView"  icon="@Embed(source='images/card.png')"/>
<s:ViewNavigator label="Quizzes" width="100%" height="100%" firstView="views.QuizzesView" icon="@Embed(source='images/test.png')"/>

When you navigate to the quiz page, you opted to select a type of quiz. Choosing a quiz, opens another page.

Now, if you leave this page, and go to another (say flash cards) – selecting the quiz tab again returns you to the last page on the stack (aka your quiz) rather than the page that allows you to select what type of quiz you want to take.

Is there a method to automatically pop the view off the stack when you hit the tab bar and navigate away? Or is there a way to ALWAYS have the first view displayed when you select that tab?

Answer 1

A FlexEvent.HIDE is fired when you switch between ViewNavigator in a TabbedViewNavigatorApplication. A solution can be to pop to your first view in the Quizzes ViewNavigator when this one is not displayed anymore:

<s:ViewNavigator id="quizzes" label="Quizzes" width="100%" height="100%" firstView="views.QuizzesView" icon="@Embed(source='images/test.png')" hide="{quizzes.popToFirstView()}" />

I’ve just added an id to your ViewNavigator and the hide function. Seems to work.