在 flex 中在运行时更改选项卡边框颜色 [英] Changing tab border color at run time in flex

问题描述

如何在运行时更改选项卡导航器控件中选项卡的边框颜色?我正在尝试使用其 IDmytab"访问它并更新它的样式.

How can I change border color of tab in tab navigator control at runtime? I am trying to access it with its id "mytab" and update it's style.

this.mytab.setStyle("bordercolor","red");

TabNavigator 有多个选项卡，我必须根据某些逻辑更改几个选项卡的样式.StyleDeclaration 适用于选项卡导航器下的所有选项卡，但如何使用基于 componentid 的 CSSStyleDeclaration?这种方法的唯一不足是无法为单个选项卡更改样式.

A TabNavigator has multiple tabs and I have to change style of few tabs based on some logic. StyleDeclaration is applicable for all the tabs under tab navigoter but how can use CSSStyleDeclaration based on componentid? The only shortfall with this approach is that Style can not be changed for individual tab.

推荐答案

直接在 TabNavigator 上设置样式将不起作用.您必须在 TabNavigator 上设置 tabStyleName 属性，然后创建一个具有相同名称的样式，该样式将应用于您的选项卡.这与我对您其他问题的回答的策略相同；只需设置 borderColor 样式即可.

Setting the style directly on the TabNavigator won't work. You have to set the tabStyleName property on TabNavigator and then create a style with the same name, which will be applied to your tabs. It is the same strategy as my answer to your other question; just set the borderColor style instead.

如果你真的需要在运行时动态设置样式，你可以检索标签的 CSSStyleDeclaration 并像这样设置:

If you really need to set the style dynamically at runtime, you can retrieve the CSSStyleDeclaration for the tabs and set it like so:

  <mx:Style>
    .tabStyle {
      /* define an empty style so there is something to get using getStyleDeclaration */
    }
  </mx:Style>

  <mx:Script>
    <![CDATA[
      protected function changeStyle(event:MouseEvent):void
      {
        var cssStyle:CSSStyleDeclaration = StyleManager.getStyleDeclaration(".tabStyle");
        cssStyle.setStyle("borderColor", "red");
      }
    ]]>
  </mx:Script>

  <mx:TabNavigator id="mytab" width="200" height="200" tabStyleName="tabStyle">
    <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)"/>

这篇关于在 flex 中在运行时更改选项卡边框颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！