2

Flex 4.6 で CSS を使用してコンポーネントをスキンしようとしmx.controls.Alertていますが、スタイルがアラートに適用されません。以前にこれを正常に実装しましたが、今回は問題を特定できません。

これが私のコードです：

<?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>

これは、メイン アプリケーションで使用しているコンポーネントです。mx:Alert で、「CSS タイプ セレクターはコンポーネントではサポートされていません: 'mx.controls.Alert'」という警告が表示されます。

次のリンクも試しました: Flex Alert.styleName not working for me

しかし、それはエラーを出します:

1067: 型 mx.styles:CSSStyleDeclaration の値を無関係の型 mx.controls:Alert に暗黙的に強制します

行で：

alertCSS = StyleManager.getStyleDeclaration("Alert");

どんな助けでも大歓迎です。私はフレックスにかなり慣れていないので、間違いを犯した可能性があることをお許しください。

4

1 に答える 1

1

s:Application タグを含むファイルである最上位アプリケーションでスタイルを定義する必要があります。

fx:style ブロックを最上位のアプリケーションに移動するだけでうまくいくはずです。

于 2015-01-13T09:50:48.297 に答える