Изменение цвета границы вкладок во время выполнения в flex

Question

Как изменить цвет рамки вкладки в управлении навигатором вкладки во время выполнения? Я пытаюсь получить к нему доступ с его идентификатором «mytab» и обновить его стиль.

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

В TabNavigator есть несколько вкладок, и мне нужно изменить стиль нескольких вкладок на основе некоторой логики. StyleDeclaration применима для всех вкладок под вкладкой navigoter, но как использовать CSSStyleDeclaration на основе componentid? Единственный недостаток с этим подходом заключается в том, что стиль не может быть изменен для отдельной вкладки.

Answer 1

Установка стиля непосредственно на TabNavigator не будет работать. Вы должны установить свойство tabStyleName на TabNavigator, а затем создать стиль с тем же именем, который будет применен к вашим вкладкам. Это та же стратегия, что и my answer to your other question; просто установите вместо этого стиль borderColor.

---

Если вам действительно нужно установить стиль динамически во время выполнения, вы можете получить CSSStyleDeclaration для вкладок и установите его следующим образом:

<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)"/>