Flex4 css應用

   Flex4 新增的spark組件中，已經沒有background屬性了，取而代之的style和theme了。

例如

InputText.setStyle("contentBackgroundColor", 0xFF0000);

 

把textinput的背景設定為紅色。

還可以通過 css來設定這些組件的style，這個contentBackgroundColor只會對spark組件的TextInput生效。

   <fx:Style><br /> @namespace s "library://ns.adobe.com/flex/spark";</p><p> s|TextInput {<br /> contentBackgroundColor: #FFFF99;<br /> }<br /> </fx:Style>

 

   多個css樣式的選擇，在控制項的styleName中加上css的名字即可，按照出現的先後次序來應用。

<fx:Style></p><p>.myFontStyle {</p><p>fontSize: 22;</p><p>}</p><p>.myOtherFontStyle {</p><p>color: #9933FF;</p><p>}<br /></fx><br /><s:Button id="myButton" styleName="myFontStyle myOtherFontStyle" label="Click Me"/>

 

可以根據空間的id來選擇樣式，

s|Button#Button3 { color:blue;}    

<s:Button id="Button3" label="Click"/>

 

 

   全域應用css樣式，flex中專門有一個叫global的名字，這個名字下的樣式會被應用到所有控制項，除非控制項自身明確指出。也可以通過

styleManager來設定全域樣式。

<fx:Style><br /> global {<br /> fontSize:22;<br /> textDecoration: underline;<br /> }<br /> </fx:Style></p><p> styleManager.getStyleDeclaration("global").setStyle("fontSize", 22);<br /> styleManager.getStyleDeclaration("global").setStyle("textDecoration", "underline");<br />styleManager.getStyleDeclaration("spark.components.Button").setStyle("fontSize",15);<br /> styleManager.getStyleDeclaration("spark.components.Button").setStyle("color",0x9933FF);

 

參考：

http://www.dremsus.com/index.php/tag/getstyle/

http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7fee.html