Невозможно применить стиль css для предупреждения в flex

Question

Я пытаюсь скомпоновать компонент mx.controls.Alert с использованием CSS в flex 4.6, но стиль не распространяется на предупреждение. Я успешно реализовал это раньше, но на этот раз я не могу изолировать проблему.

Вот мой код:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Canvas xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="400"> 
<fx:Declarations> 
    <!-- Place non-visual elements (e.g., services, value objects) here --> 
</fx:Declarations> 
<fx:Style> 
    @namespace flexlib "http://code.google.com/p/flexlib/"; 
    @namespace s "library://ns.adobe.com/flex/spark"; 
    @namespace mx "library://ns.adobe.com/flex/mx"; 
    @namespace components "components.*"; 
    @namespace flexgif "org.gif.flexgif.*"; 

    mx|Alert{ 
     background-color:#FFFFFF; 
     background-alpha:1; 
     color:#FFFFFF; 
     border-color:#223f56; 
     border-style:solid; 
     border-thickness:1; 
     button-style-name:"alertButton"; 
     chromeColor:#223f56; 
     header-height:30; 
     drop-shadow-enabled: true; 
     messageStyleName:"messageStyle"; 
     titleStyleName:"titleStyle";  

    } 

    .alertButton{ 
     emphasizedSkin: ClassReference('skins.CustomButtonSkin'); 
     skin: ClassReference('skins.CustomButtonSkin'); 
     buttonHeight: 30; 
     color: #FFFFFF; 
     verticalAlign: middle; 
     horizontalAlign:center; 
     paddingBottom: 4; 
     textRollOverColor: #FFFFFF; 
     fontFamily:MavenPro_R; 

     /* drop-shadow-enabled:false; 
     theme-color:#40779f; 
     chromeColor:#40779f; 
     color:#FFFFFF; 
     backgroundColor:#40779f; 
     verticalAlign:middle; 
     horizontalAlign:center; 
     buttonHeight:30; 
     paddingBottom:5px; */ 
    } 


    .messageStyle{ 
     fontFamily:MavenPro_R; 
     font-size :12; 
     color:#595959; 
    } 
    .titleStyle{ 
     backgroundColor:#223f56; 
     font-size :14; 
     font-weight:bold; 
     color:#FFFFFF; 

    } 
    mx|Alert, mx|Button { 
     fontFamily:MavenPro_B; 
     textFieldClass: ClassReference("mx.core.UIFTETextField"); 
    } 
</fx:Style> 

<fx:Script> 
    <![CDATA[ 
     import mx.controls.Alert; 

     public function showAlert(event:MouseEvent):void{ 

      Alert.show("Hi, I'm a test alert"); 
     } 
    ]]> 

</fx:Script> 

<mx:Button id="testButton" click="showAlert(event)" label="Alert" x="200" y="200"/> 
</mx:Canvas> 

Это компонент, я использую в основном приложении. Это дает предупреждение при тх: Предупреждение, что «селекторы типа CSS не поддерживаются в компонентах:" mx.controls.Alert»

Я также попробовал следующую ссылку: Flex Alert.styleName not working for me

Но это дает ошибка:

1067: Implicit coercion of a value of type mx.styles:CSSStyleDeclaration to an unrelated type mx.controls:Alert

В строке:

alertCSS = StyleManager.getStyleDeclaration("Alert"); 

Любая помощь высоко ценится. Пожалуйста, извините меня за любую ошибку, которую я мог бы сделать, поскольку я довольно новичок в flex.

Answer 1

Вы должны определить свои стили в приложении верхнего уровня, это файл, который содержит тег s: Application.

Простое перемещение вашего блока fx: style на приложение верхнего уровня должно сделать трюк.