Доступ к представлению в навигаторе вкладок при нажатии на вкладку

Question

У меня есть представление в Flex 3, где я использую навигатор по вкладкам и несколько представлений внутри навигатора по вкладкам. Мне нужно знать, какое представление было выбрано из-за того, что это одно конкретное представление, тогда мне нужно принять меры, т.е. если щелкнуть представление с идентификатором "secondTab", сделать что-то

Я настроил его на уведомление, моя проблема в том, что мне нужно знать, что это за вид. Вызов tab.GetChildByName или подобного метода, похоже, возвращает мне TabSkin объект.

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" 
width="100%" 
height="100%"   
xmlns:local="*"
creationComplete="onCreationComplete(event)">

<mx:Script>
    <![CDATA[
        import mx.events.FlexEvent;
        import mx.controls.Button;

        protected function onCreationComplete(event:Event):void  {
            for(var i:int = 0; i < myTN.getChildren().length; i++) {
                var tab:Button = myTN.getTabAt(i);
                tab.addEventListener(FlexEvent.BUTTON_DOWN, tabClickHandler);
            }               
        }

        private function tabClickHandler(event:FlexEvent):void {
            var tab:Button;

             if(event.currentTarget is Button) {
                tab = event.currentTarget as Button;

                // how do I access the actual view hosted in a tab that was clicked?
             }
        }



    ]]>
</mx:Script>

<mx:TabNavigator id="myTN">
    <local:ProductListView id="firstTab" 
                            label="First Tab" 
                            width="100%" height="100%" />
    <local:ProductListView id="secondTab" 
                            label="Second Tab" 
                            width="100%" height="100%" />
</mx:TabNavigator>


</mx:VBox>

Answer 1

TabNavigator является подклассом ViewStack и будет вызывать событие change при выборе вкладки.

<mx:TabNavigator id="myTN" change="childChanged()">
    <local:ProductListView id="firstTab" 
                            label="First Tab" 
                            width="100%" height="100%" />
    <local:ProductListView id="secondTab" 
                            label="Second Tab" 
                            width="100%" height="100%" />
</mx:TabNavigator>

Это так же просто, как:

private function childChanged():void
{
  if(myTN.selectedChild == this.firstTab) //or myTN.selectedIndex == 0
  {
     trace("selected the first one");
  }
  else if(myTN.selectedChild == this.secondTab) //or myTN.selectedIndex == 0
  {
     trace("selected the second one");
  }
}

Answer 2

Поскольку TabNavigator является расширением ViewStack, вы можете получить доступ к выбранному представлению с помощью свойства selectedChild:

private function tabClickHandler(event:FlexEvent):void {
    view = myTN.selectedChild;

    // Do what you need to do with it here...
}

Для получения дополнительной информации о том, как работает TabNavigator, ознакомьтесь с Документацией:

http://livedocs.adobe.com/flex/3/html/help.html?content=navigators_4.html