flex动态加载使用css文件实例

 

1、css_dynaset.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
      xmlns:s="library://ns.adobe.com/flex/spark"
      xmlns:mx="library://ns.adobe.com/flex/halo"
      minWidth="1024" minHeight="768"
      creationComplete="init();">

<fx:Script>
   <![CDATA[
    import mx.styles.StyleManager;
    import mx.collections.ArrayCollection;
   
    /*由于css文件不自动编译成.swf文件，因此每保存好一次记得就要手动编译一次*/
   
    private function init():void{
     var array:Array = new Array();
     array.unshift({label:"红", selfColor:"red.swf"});    //必须以label为名
     array.unshift({label:"绿", selfColor:"green.swf"});
     array.unshift({label:"蓝", selfColor:"blue.swf"});
     comboBoxID.dataProvider = new ArrayCollection(array);
    }
   
    private function loadStyles(styleURL:String):void{
     StyleManager.loadStyleDeclarations(styleURL);    //动态加载css的函数
    }
   
   ]]>
</fx:Script>

<mx:ComboBox id="comboBoxID" x="500" y="50" prompt="Please select a style"
     change="loadStyles(comboBoxID.selectedItem.selfColor);"/>

</s:Application>

2、red.css

/* CSS file */
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/halo";

/* red.css */
s|Application{
backgroundColor: red;
}

3、green.css

/* CSS file */
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/halo";

/* green.css */
s|Application{
backgroundColor: haloGreen;
}

4、blue.css

/* CSS file */
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/halo";

/* blue.css */
s|Application{
backgroundColor: haloBlue;
}