css - Flex 3 - 样式未完全应用于 TabNavigator 中动态创建的选项卡

Question

当我通过 ActionScript 动态创建选项卡时，新创建(和选定)选项卡的样式会应用到外观，但不会应用到文本，除非我单击另一个选项卡然后单击返回。

ActionScript

private function clickAddTabHandler(event:Event):void{
   var vbox:VBox = new VBox;
   var tab:Canvas = new (Canvas);
   vbox.label = "Select Location";
   vbox.addChild(tab);
   tabBar.addChild(vbox);
   tabBar.selectedIndex = tabBar.numChildren-1;
  }

XML

<mx:TabNavigator id="tabBar" width="100%" height="100%" tabStyleName="tabNavigator" selectedTabTextStyleName="tabNavigatorSelected" tabHeight="19">

CSS

.tabNavigator
{
   disabledSkin: Embed(source="assets/skins/TabBar-tab_disabledSkin.png",
    scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   downSkin: Embed(source="assets/skins/TabBar-tab_downSkin.png",
   scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   overSkin: Embed(source="assets/skins/TabBar-tab_overSkin.png",
   scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   upSkin: Embed(source="assets/skins/TabBar-tab_upSkin.png",
   scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   selectedDisabledSkin: Embed(source="assets/skins/TabBar-tab_selectedDisabledSkin.png",
       scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   selectedUpSkin: Embed(source="assets/skins/TabBar-tab_selectedUpSkin.png",
       scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   selectedOverSkin: Embed(source="assets/skins/TabBar-tab_selectedUpSkin.png",
       scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   selectedDownSkin: Embed(source="assets/skins/TabBar-tab_selectedUpSkin.png",
       scaleGridTop=1, 
       scaleGridLeft=20, 
       scaleGridBottom=18, 
       scaleGridRight=32);
   textAlign: left; 
   paddingLeft: 20; 
   paddingRight: 20; 
   fontSize: 11; 
   fontFamily: Helvetica Neue; 
   color: #FFFFFF;
   textRollOverColor: #FFFFFF;
}

.tabNavigatorSelected
{
   textAlign: left; 
   paddingLeft: 20; 
   paddingRight: 20; 
   fontSize: 11; 
   fontFamily: Helvetica Neue; 
   color: #135F9E; 
   textRollOverColor: #135F9E; 
   textSelectedColor: #135F9E;
}

Answer 1

总是使用 css 我建议使用样式资源管理器。它一直帮助我获得正确的样式。

http://examples.adobe.com/flex3/consulting/styleexplorer/Flex3StyleExplorer.html

PS，使用“代码示例”按钮更好地格式化您的代码，它是用引号标记的 101010 和编辑器顶部的图像图标，或者只是用 4 个空格缩进。这将使每个人都更容易阅读。