一、??????????
關于樣式
?
你可以通過樣式屬性來修改
Flex
組件的外觀,這此屬性可以定義一個
Label
控件的字體大小,或者是
Tree
控件的背景顏色。在
Flex
中,一些樣式屬性是從父容器繼承到子控件的,如樣式類型和類。這意味著你只需定義一次樣式,然后你可以將此樣式應用到單個控件和列表控件,此外,你還可以在本地覆蓋每個控件的單獨樣式屬性。組件級別和全局級別的樣式將給你控制應用程序的外觀以很大的靈活性。
本節向你介紹將樣式應用到控件,也介紹了
CSS
(層疊樣式)的基礎知識,樣式屬性值的基本格式(
Length,Color ,Time
)以及樣式的繼承。本節的子節介紹了在
Flex
中,應用樣式的不同方法。
Flex
不提供使用
CSS
控制組件布局的所有屬性方面,像
x,y,width
和
height
是
UIComponent
的屬性,所以不能用
CSS
來定義。其他屬性,比如
left,right,top
和
bottom
是樣式屬性,通常用來在容器中操作組織件的定位。
?
一、???????????
在
Flex
中使用樣式
?
在
Flex
中有使用樣式的很多方法。一些提供了更細粒度和可編程的控制,另外一些不是很靈活,但是可運算量很小。在
Flex
中將樣式應用到控件有幾種方法。
當應用樣式的時候,你必須留心你的主題支持哪些屬性。
Flex
中的并不支持所有的樣式屬性。更多的信息,請查看“關于支持的樣式”
二、???????????
外部樣式表
使用
CSS
應用樣式到文檔或者整個應用程序。你可以不調用
ActionScript
程序指定一個樣式表。這是應用樣式的最簡單方法,但是這不是最靈活的方法。樣式表可以定義被所有控件繼承的全局樣式
,
也可以定義應用到某一控件的單獨樣式類。
下面的例子
,
在當前的文檔應用了一個外部樣式表
myStyle.css.
<mx:Style source=”myStyle.css”/>
更多關于應用外部樣式表的信息,請參看
”
應用外部樣式表
”P617
Flex
在
framework.swc
文件中包括了一個全局樣式表
(default.css)
。這個文件包含全局樣式類選擇器的定義,以及大多數
Flex
組件的類型選擇器。關于
default.css
更多信息
,
請參看“關于默認樣式表部分”(
P618
)
Flex
還包括一些其他的樣式表,他們有統一的外觀。更多信息,參看
”
關于包括主題文件
”P631
?
三、???????????
本地樣式定義
使用
<mx:Style>
標簽定義應用到當前文檔和其子組件的樣式,你使在
<mx:Style>
標簽中應用
CSS
語法定義樣式,此樣式可以應用到某個控件和單獨的控件的實便。下面的例子定義了一個新的樣式并且將它應用到
myButton
控件。
<mx:Style>
?????? .myFontStyle { fontSize:15}
</mx:Style>
<mx:Button id=”myButton” styleName=”myFontStyle” label=”Click Here”/>
下面的例子定義了一個新的樣式并且應用到一個按鈕控件上。
更多的關于使用本地樣式定的信息,請參看
”
使用本地樣式定義
”p619
?
四 樣式管理器類
(StyleManager )
使用樣式管理器類(
StyleManager
)應用樣式到所有的類,或者應用到所有的指定類的實例。下面的例子設定了所有的
TextArea
控件的字體大小(
fongSize
)為
15
像素。
StyleManager.getStyleDeclaration(“TextArea”).setStyle(“fongSize”,15);
你也可以使用
CSSStyleDeclaration
對象去構建一個運行時樣式表,并且使用
StyleManager
類的
setStyleDeclaration()
方法運用這些樣式
.
使用
StyleManager
類的更多信息,請參考
”
運用樣式管理器類
(StyleManager)”.
?
getStyle()
和
setStyle()
方法的使用
使用
setStyle()
和
getStyle()
方法操作控件實例的樣式屬性。使用這些方法運用樣式比使用樣式表需要客戶端大量的處理資源,但是擔供了更細粒度的應用。
?
下面的例子設定了
Button
控件的實例
myButton
的字體大小為
15
像素
.
myButton.setStyle(“fontSize”,15);
關于
getStyle()
和
setStyle()
方法的更多信息,請參看
”
使用
getStyle()
和
setStyle()
方法節
”p623
?
五 內聯樣式
使用
MXML
標簽應用樣式屬性。這些屬性僅被除應用到控件的實例。這是應用實例屬性的最簡便的方法,因為沒有
ActionScript
代碼塊和方法調用。
下面的例子設定了
Button
控件的實例
myButton
的字體大小為
15
像素
<:Button id="myButton" fontSize="15" label="My Button"/>
?
在一個
MXML
標簽里,你必須使用樣式屬性名稱的駝峰表示法。例如,前一個例子,你必須寫成“
fongSize”
而不是“
font-size(CSS
方式
).
更多的樣式屬性名,請參考“關于屬性和選擇器名稱節”
p607.
你可以給內聯樣式屬性綁定值。
關于內聯樣式的更多信息,請參看
”
使用內聯樣式
”.
?
六 設定全局樣式
大多數文本和顏色樣式,比如
fontSize
和
color
屬性,是可繼承的。當你應用一個可繼承的樣式到一個容器,此容器的所有子組件會繼承此樣式屬性的值。如果你設定一個面板(
Panel
)容器的顏色(
color
)屬性為綠色(
green
)
,
所有在此容器中的按鈕都將是綠色,除非這些按鈕覆蓋了顏色(
color
)屬性。
然后一些樣式并不是可繼承的。如果你應用這些樣式屬性到父容器,那么只有父容器應用了此樣式,此容器的子控件沒有使用此不可繼承的樣式屬性的值。
運用全局樣式,你可以應用不可繼承的樣式到所有的控件而不需要顯示的覆蓋此樣式。
Flex
提供以下方法應用全局樣式:
A.
StyleManager
樣式管理器全局樣式
B.
CSS
全局選擇器。
樣式管理器讓你將全局樣式應用到所有的控件。更多的關于應用樣式管理器的信息,請參考“使用樣式管理器類
StyleManager
”
在你的
CSS
樣式定義中應用
global
選擇器應用全局樣式,這些可以在外部的樣式表中定義也可在
<mx:Style>
標簽中定義。更多信息,參看“使用全局選項擇器(
global
)”