更改Flex 3中的选项卡样式

时间:2012-03-16 19:28:39

标签: flash flex flash-builder

我是Flex 3.4的新手。我想在点击按钮时更改几个标签的样式(突出显示它们)。我来自javascript背景,无法以Flex的方式解释。

1 个答案:

答案 0 :(得分:1)

Flex中的样式选项卡有点棘手 - TabBar和TabNavigator类有一个名为tabStyleName的样式,它是另一个定义选项卡外观的独立样式的名称。这是一个示例,通过更改TabBar上的tabStyleName样式,将一组标签从红色背景更改为蓝色 - 希望您可以根据需要调整它。


  <mx:Style>
    .redTabs {
      fillColors: #cc0000, #cc0000;
    }

    .blueTabs {
      fillColors: #0000cc, #0000cc;
    }
  </mx:Style>

  <mx:Script>
    <![CDATA[
      protected function changeStyle(event:MouseEvent):void
      {
        theTabs.setStyle("tabStyleName", "blueTabs");
      }
    ]]>
  </mx:Script>

  <mx:TabNavigator id="theTabs" x="10" y="10" width="200" height="200" tabStyleName="redTabs">
    <mx:Canvas label="apple" width="100%" height="100%">
    </mx:Canvas>
    <mx:Canvas label="orange" width="100%" height="100%">
    </mx:Canvas>
    <mx:Canvas label="banana" width="100%" height="100%">
    </mx:Canvas>
  </mx:TabNavigator>

  <mx:Button x="10" y="218" label="Change Style!" click="changeStyle(event)"/>

修改:我已将示例更改为使用TabNavigator。