Posted tagged ‘tabnavigator’

Styling Individual Tabs in a TabNavigator

July 1, 2009

I had to color individual tabs in a Flex TabNavigator component.  I found the solution online so I will repost it here in my own words for the benefit of myself and others.

First, you have to wait for the TabNavigator’s creationComplete event if you defined your TabNavigator’s children at compile time.  In your creationComplete event listener, you can use the getTabAt method of the TabNavigator to retrieve tabs by their index.  With the case of a TabNavigator, getTabAt returns Buttons.  So to style the first tab, you would create a style called FirstTab in your CSS file, and then write the following code:

tabNavigator.getTabAt(0).styleName = “FirstTab”;

If you create your tabs at runtime, the tabs will not be immediately available after you add children to the TabNavigator.  I found that listening for the updateComplete event for the TabNavigator and then executing getTabAt was successful.