Flex4 - Использование ButtonBar перемещаться из одного .mxml файла в другой

Question

я создаю оконное приложение в FLEX3 с Adobe Flash Builder 4.7

У меня есть два .mxml файлов (Main.mxml и Home.mxml)

в Main.mxml у меня есть ButtonBar, когда пользователь нажимает на главном ButtonBar, я хочу, чтобы пользователь будет перенаправлен на Home.mxml

Я это для прибегая к помощи некоторое время теперь, и нет четкого ответа на этот ,

Я просмотрел ViewStack и TabNavigator и Штаты, я не уверен, что это то, что я ищу.

Вот мой Main.mxml Файл

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" 
         applicationComplete="init()" 
         showStatusBar="false"> 

    <fx:Declarations></fx:Declarations> 

    <fx:Style> 
     @namespace s "library://ns.adobe.com/flex/spark"; 
     s|ButtonBar s|ButtonBarButton:upAndSelected, 
     s|ButtonBar s|ButtonBarButton:overAndSelected, 
     s|ButtonBar s|ButtonBarButton:downAndSelected, 
     s|ButtonBar s|ButtonBarButton:disabledAndSelected { 
      chromeColor: #666666; 
      color: #FFFFFF; 
      fontSize: 32; 
     } 
     s|ButtonBar { 
      chromeColor: #000000; 
      color: #FFFFFF; 
      fontSize: 32; 
      bottom: 0; 
      typographicCase: uppercase; 
     } 
    </fx:Style> 

    <s:ButtonBar width="100%" height="13%"> 
     <mx:ArrayCollection> 
      <fx:String>Home</fx:String> 
     </mx:ArrayCollection> 
    </s:ButtonBar> 

</s:WindowedApplication> 

и вот мой Home.mxml файл

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx"> 
    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <s:Label text="Here"/> 

</s:WindowedApplication> 

Пожалуйста, помогите

Answer 1

Вы можете подойти к этому вопросу несколько способов. Я расскажу о том, в чем я более опытен.

Во-первых, пожалуйста, взгляните на видео внутри этого repository, чтобы вы знали, о чем я говорю.

Это приложение использует боковое меню, состоящее из отдельных кнопок, аналогичного подхода к ButtonBar.

Справа есть TabNavigator, который я вручную добавил на него некоторые MXML-представления. Каждый вид представлен как собственный .mxml-файл.

Вот упрощенная версия основного файла:

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:views="views.*"> 

<s:VGroup left="0" top="0" bottom="0" width="100" horizontalAlign="center"> 
    <s:Image width="60" height="60" source="assets/someicon.png" click="goHome(event)"/>   
    <s:Image width="60" height="60" source="assets/someicon.png" click="goIcons(event)"/> 
</s:VGroup> 

<mx:TabNavigator id="myTabNavigator" left="100" right="0" top="0" bottom="0" borderStyle="none" paddingTop="0" tabHeight="0" tabWidth="0" creationPolicy="auto" backgroundAlpha="0"> 
    <views:HomeView /> 
    <views:IconsView /> 
</mx:TabNavigator> 

</s:WindowedApplication> 

Когда пользователь нажимает одну из кнопок, то TabNavigator изменит индекс:

protected function goHome(event:MouseEvent):void 
{ 
    myTabNavigator.selectedIndex = 0; //This value will change depending on the clicked button. 
} 

protected function goIcons(event:MouseEvent):void 
{ 
    myTabNavigator.selectedIndex = 1; //This value will change depending on the clicked button. 
} 

Эти 2 функции должны быть внутри ваш блок fx: Script.

Таким образом вы можете изменить текущую отображаемую вкладку в TabNavigator с вашего ButtonBar.