編輯完這個FLEX下的CSS說明後,我基本已經兵臨崩潰邊緣了。在些天在AIRIA下了很多好東西,今天終於有空,也發一個比較不錯的東西給你們,相信都比較須要這個FLEX下的CSS使用方法的詳細說明(好像我這份還不夠詳細,望你們補充)。
AIRIA真的是一個不錯的網站,很高興在這裏認識你們。
在FLEX中使用樣式方法
1、使用本地樣式定義
使用<mx:Style>標籤在MXML文件中建立本地的樣式定義。這個標籤包含了符合CSS2.0語法的樣式表定
義。這些定義會應用到當前文檔以及當前文檔的子文檔。
<mx:style>
.solidBorder{//類選擇樣式
border-style:solid;
}
button{//組件定義樣式
border-style:solid;
}
....
</mx:style>
//應用到組件
<mx:VBoxstyleName="solidBorder"/>
<mx:button/>//文檔中的button自動應用樣式表中的樣式
2、使用外部樣式表
FLEX支持外部CSS樣式表。要應用一個樣式表到當前文檔和子文檔,使用<mx:Style>標籤中的source
屬性。
<mx:Application...>
<mx:Stylesource="style/style.css"/>//載入外部樣式表
...
</mx:Application>
style.css文件中的樣式表定義與本地樣式定義相同。
3、使用內聯樣式
能夠像設定組件的屬性同樣在MXML標籤中設定樣式屬性。內聯樣式的優先級高於本地樣式和外部樣式
。
<mx:buttonborderStyle="solid">//設定樣式屬性
4、使用setStyle()方法
能夠在ActionScript中使用方法來操做組件的樣式屬性。使用setStyle()方法的優先級是最高的。
<mx:Application...>
<mx:Script>
<![CDATA[privatefunctiominitButton():void{myButton.setStyle("paddingTop",12);myButton.setStyle("paddingBottom",12);}]]>
</mx:Script>
<mx:Buttonid="myButton"initialize="initButton();">//組件初始化時調用設定樣式的
5、腳本方法
</mx:Application>各組件對應的樣式屬性
themeColor主題顏色:若是對色彩樣式配置不想過多的去設置的話,themeColor是一個選擇。它可讓你選擇一種基本色彩,而後組件的邊框,外觀等色彩將會以此色彩爲基礎構成一組缺省的樣式,組件都可使用此樣式屬性。
Application組件樣式屬性
backgroundImage背景圖使用Embed(source="");來應用
backgroundColor背景色
backgroundGradientColors背景漸進色這個屬性要設置2個色彩,漸進起始色和
漸進結束色,中間以逗號分隔
backgroundGradientAlphas背景漸進色透明度這個屬性要設置2個透明度,對應漸進色
中的2種顏色值的範圍是0.00~1.00,中間以逗號分隔
panel組件樣式屬性
cornerRadius邊角度數panel外框邊角度數數值從0~280時爲直角,數值越大,圓角弧度越大
headerHeight標題頭高度panel標題頭的高度數值從0~50
dropShadowEnabled是否顯示投影true和false2個屬性
shadowDistance投影大小dropShadowEnabled爲true時有效數
值從0~20
shadowDirection投影方向3個屬性leftrightcenter
dropShadowColor投影的顏色
roundedBottomCorners底部邊角是否爲圓角true和false2個屬性若爲false,則底部邊角爲直角,cornerRadius對其無影響;若爲true,cornerRadius對底部邊角纔會起做用
textAlign文字對齊方向3個屬性leftrightcenter
backgroundColor背景色除title外有內容的部分背景色
backgroundAlpha背景透明度除title外有內容的部分背景透明度數值從0.00~1.00
borderColor邊框色包括外邊框和title與主體內容之間的邊框色
borderAlpha邊框透明度包括外邊框和title與主體內容之間的邊框透明度數值從0.00~1.00
borderStyle邊框樣式undefined,none,solid3種樣式:默認爲undefined。當取值爲none或
solid時,title與主體內容之間將無邊框間隔或是solid樣式。
borderThickness邊框厚度邊框樣式爲solid時的邊框粗細程度,數值從0~20
headerColors標題頭背景漸變色這個屬性要設置2個色彩,漸進起始色和漸進結束色,中間以逗號分隔
footerColors底部背景漸變色這個屬性要設置2個色彩,漸進起始色和漸進結束色,中間以逗號分隔
highlightAlphas高光透明度只針對headerColors有效。有2個數值,中間以逗號分隔前一個爲高光亮度,從0.00~1.00,爲1時最亮,爲白色後一個爲高光透明度,從0.00~1.00,爲1時最透明(可經過設置製做出水晶半透明效果)
color文本顏色
若想設置panel中title中的字體,外觀,背景等樣式,爲了避免與panel中樣式相沖突,需在樣式
表中定義一個引用的樣式。
panel{
...
titleStyleName:"myTitleStyle";
...
}
而後新定義一個myTitleStyle樣式來設置title的樣式。
TabNavigator組件樣式屬性
tabHeight每一個Tab的高度數值從0~50
tabWidth每一個Tab的寬度數值從0~200
cornerRadius邊角圓角度每一個Tab中主體內容的邊角圓角度從0~20注意不是Tab的邊角
horizontalGap每一個Tab之間的間隔寬度數值從-10~20當爲負數時,Tab將會出現重疊
horizontalAlignTab的對齊方向leftcenterright
paddingLeft左填充距離整個一組Tab的左填充距離,數值從0~20.不是指每一個Tab的填充距離
paddingRight右填充距離整個一組Tab的右填充距離,數值從0~20.不是指每一個Tab的填充距離
textAlign文本對齊方向每一個Tab中主體內容中的文本對齊方向leftcenterright
textIndentTab標題偏移度每一個Tab中標題相對於居中位置的偏移程度數值從0~20
backgroundColor背景色Tab和Tab中主體內容都會應用此背景色
backgroundAlpha背景色透明度只針對Tab中主體內容的背景色有效數值從0.00~1.00
borderStyle邊框樣式Tab中主體內容的邊框樣式
nonesolidinsetoutset四種樣式
borderColor邊框顏色Tab中主體內容的邊框顏色
borderThickness邊框粗細borderStyle爲solid時有效數值從0~20
dropShadowEnabled是否顯示投影true和false2個屬性
shadowDistance投影大小dropShadowEnabled爲true時有效數值從0~20
dropShadowColor投影的顏色
color主體內容的文本顏色
若想設置TabNavigator中tab中的樣式,爲了避免與TabNavigator中樣式相沖突,需在樣式表中定義
一個引用的樣式。
TabNavigator{
...
tabStyleName:"myTabs";
...
}
而後新定義一個myTabs樣式來設置tab的樣式。
myTabs中的設置
cornerRadiusTab邊角圓角度每一個Tab的邊角圓角度從0~20注意不是Tab主體內容的邊角
fillColorsTab填充漸變色未選中的Tab的填充漸變色這個屬性要設置2個色彩,漸變起始色和漸變結束色,中間以逗號分隔
fillAlphasTab填充色透明度未選中的Tab的填充色透明度這個屬性要設置2個值,漸變起始色透明度和漸變結束色透明度,中間以逗號分隔,數值從0.00~1.00
backgroundColorTab背景色選中的Tab會應用上背景色
backgroundAlphaTab背景色透明度數值從0.00~1.00
borderColorTab邊框顏色
textRollOverColor鼠標通過Tab時的Tab文字顏色
Accordion組件樣式屬性
headerHeight標籤頭高度Accordion組件中每一個標籤頭的高度
dropShadowEnabled是否顯示投影true和false2個屬性
shadowDistance投影的大小從0~20
shadowDirection投影方向leftrightcenter
dropShadowColor投影的顏色
borderStyle邊框的樣式nonesolid
borderThickness邊框的粗細從0~20
backgroundColor背景色整個Accordion組件包括標籤頭和主體內容都會應用上背景色
fillColors未選中的標籤頭填充色這個屬性要設置4個色彩值:漸變起始色,漸變結束色,鼠標通過時漸變起始色,鼠標通過時漸變結束色
fillAlphas未選中的標籤頭填充色透明度對應於fillColors設置4個透明度數值從0.00~1.00
selectedFillColors選中的標籤頭填充色這個屬性要設置2個色彩值:漸變起始色,漸變結束色
color標籤頭文字的顏色
textRollOverColor鼠標通過標籤頭時的文字顏色
textSelectedColor鼠標點擊標籤頭時的文字顏色
textIndent標籤頭文字縮進距離的大小數值從0~100
openDuration打開新標籤的速度數值從0~1000
LinkBar組件樣式屬性
horizontalGap水平方向各連接之間的間隔數值從0~20
separatorWidth間隔線的粗細各連接之間間隔線的粗細數值從0~20
separatorColor間隔線的顏色
borderStyleLinkBar的邊框樣式nonesolid
borderColor邊框顏色
borderThickness邊框粗細程度數值從0~20
cornerRadius邊框圓角度數值從0~20
dropShadowEnabled是否顯示邊框投影true和false
shadowDistance投影大小數值從0~20
shadowDirection投影方向leftcenterright
dropShadowColor投影顏色
backgroundColor背景色
backgroundAlpha背景色透明度數值從0.00~1.00
color連接文字顏色
disabledColor選中的連接文字顏色
rollOverColor鼠標通過未選中的連接時的背景色
textRollOverColor鼠標通過未選中的連接時的文字色
selectionColor鼠標點擊未選中的連接時的背景色
textSelectedColor鼠標點擊未選中的連接時的文字色
ApplicationControlBar組件樣式屬性
cornerRadius邊框圓角度數值從0~20
dropShadowEnabled是否顯示邊框投影true和false
shadowDistance投影大小數值從0~20
dropShadowColor投影顏色
borderStyle邊框樣式defaultnonesolid
borderColor邊框顏色
borderThickness邊框粗細數值從0~20
backgroundColor背景顏色
fillColors填充漸變色這個屬性要設置2個色彩,漸變起始色和漸變結束色,中間以逗號分隔
fillAlphas填充色透明度這個屬性要設置2個透明度漸變起始色透明度和漸變結束色透明度
highlightAlphas高光透明度2個數值,中間以逗號分隔前一個爲高光亮度,從0.00~1.00,爲1時最亮,爲白色後一個爲高光透明度,從0.00~1.00,爲1時最透明(可經過設置製做出水晶半透明效果)
backgroundColor背景色
List組件樣式屬性
backgroundColor背景色
backgroundAlpha背景色透明度數值從0.00~1.00
useRollOver是否使用鼠標通過List每一項時產生效果truefalse
rollOverColor鼠標通過每一項時的背景色useRollOver爲true時有效
textRollOverColor鼠標通過每一項時的文字顏色useRollOver爲true時有效
alternatingItemColorsList中間隔背景色這個屬性要設置2個色彩,某一項的背景色和下一項的背景色color選項文本顏色
selectionColor被選中項的背景色
textSelectedColor被選中項的文字顏色
textIndent選項文本縮進距離
selectionDuration被選中項漸變速度被選中項背景色變爲
selectionColor中的值的速度,設置可實現漸變效果數值從0~5000值越大,漸變速度越慢css
borderStyle邊框樣式 none\solid\..
borderColor邊框顏色
borderThickness邊框粗細數值從0~20
dropShadowEnabled是否顯示投影true和false2個屬性
shadowDistance投影大小dropShadowEnabled爲true時有效數值從0~20,shadowDirection投影方向3個屬性leftrightcenter
dropShadowColor投影的顏色
DataGrid組件樣式屬性
backgroundColor背景色
backgroundAlpha背景色透明度數值從0.00~1.00
alternatingItemColors間隔背景顏色間隔項的顏色這個屬性要設置2個色彩,某一項的背景色和下一項的背景色
headerColors標題頭背景漸變顏色這個屬性要設置2個色彩,標題頭背景漸變起始色和標題頭背景漸變結束色
horizontalGridLines是否顯示橫向分隔線是否顯示每一行之間的橫向分隔線truefalse
horizontalGridLineColor橫向分隔線顏色horizontalGridLines爲true時有效
verticalGridLines是否顯示垂直方向分隔線是否顯示每一行之間的橫向分隔線truefalse此屬性只對內容中的分隔線有效,標題頭的分隔線是默認的
verticalGridLineColor垂直方向分隔線顏色verticalGridLineColor爲true時有效
useRollOver是否實現鼠標通過時的變化效果truefalse
rollOverColor鼠標通過一行時的本行背景色useRollOver爲true時有效
textRollOverColor鼠標通過一行時的本行文字顏色useRollOver爲true時有效(這個屬性好像無效?)
color文字顏色
textSelectedColor被選中行的文字顏色(這個屬性好像無效?)
selectionColor被選中行的背景顏色
textIndent每一行文字縮進距離數值從0~30
Tree組件樣式屬性
backgroundColor背景色
backgroundAlpha背景色透明度數值從0.00~1.00
alternatingItemColors間隔行的顏色這個屬性設置2個色彩,某一行的背景色和下一行的背景色depthColors樹級結構中每級的背景色這個屬性可設置多個色彩,中間以逗號分隔。對應從樹的頂級到最後一級每1級的背景色。設置此屬性會覆蓋alternatingItemColors中的設置
useRollOver是否使用鼠標通過每一行時的效果truefalse
rollOverColor鼠標通過每一行時的背景色useRollOver爲true時有效
textRollOverColor鼠標通過每一行時的文字顏色useRollOver爲true時有效
borderThickness邊框的粗細數值從0~20
color文本顏色
selectionColor被選中行的背景色
textSelectedColor被選中行的文本顏色
textIndent文字縮進值文字相對於圖標的縮進值從0~50
indentation每一層級相對於上一層級的縮進值從0~50
openDuration打開和關閉本層內容的速度從0~1000
selectionDuration被選中層級的背景色漸變速度從0~3000
TextInput組件樣式屬性
backgroundColor背景色
backgroundAlpha背景色透明度數值從0.00~1.00color文本顏色
borderStyle邊框樣式nonesolidinset outset
borderColor邊框顏色
borderThickness邊框粗細borderStyle爲solid時有效數值從0~20
cornerRadius邊框圓角度borderStyle爲solid時有效數值從0~20
textIndent輸入框中內容縮進值數值從0~20
dropShadowEnabled是否顯示投影truefalse
shadowDirection投影方向leftcenterright
shadowDistance投影大小數值從0~20
dropShadowColor投影顏色
NumericStepper組件樣式屬性
backgroundColor背景色
backgroundAlpha背景色透明度數值從0.00~1.00
borderStyle邊框樣式nonesolidinset
fillColors上翻和下拉鍵的漸變填充色這個屬性要設置4個色彩
值:漸變起始色,漸變結束色,鼠標通過時漸變起始色,鼠標通過時漸變結束色
fillAlphas填充色透明度針對fillColors屬性這個屬性要設置4個透明度漸變起始色透明度漸變結束色透明度鼠標通過時漸變起始色透明度鼠標通過時漸變結束色透明度數值從0.00~1.00
highlightAlphas高光透明度針對fillColors屬性
2個數值,中間以逗號分隔前一個爲高光亮度,從0.00~1.00,爲1時最亮,爲白色後一個爲高光透明度,從0.00~1.00,爲1時最透明
dropShadowEnabled是否顯示投影truefalse
shadowDirection投影方向leftcenterright
shadowDistance投影大小數值從0~20
dropShadowColor投影顏色
ComboBox組件樣式屬性color全部選項中文本顏色
borderColor邊框顏色
cornerRadius邊框圓角度數值從0~20
fillColors被選擇項的漸變填充色這個屬性要設置4個色
彩值:漸變起始色,漸變結束色,鼠標通過時漸變起始色,鼠標通過時漸變結束色
fillAlphas填充色透明度針對fillColors屬性這個屬性要設置4個透明度漸變起始色透明度漸變結束色透明度鼠標通過時漸變起始色透明度鼠標通過時漸變結束色透明度數值從0.00~1.00
highlightAlphas高光透明度針對fillColors屬性2個數值,中間以逗號分隔前一個爲高光亮度,從0.00~1.00,爲1時最亮,爲白色後一個爲高光透明度,從0.00~1.00,爲1時最透明(可經過設置製做出水晶半透明效果)
backgroundAlpha下拉框的背景透明度數值從0.00~1.00
alternatingItemColors下拉框中選項的間隔背景色這個屬性設置2個色彩,某一行的背景色和下一行的背景色
useRollOver下拉框中選項是否使用鼠標通過時的效果truefalse
rollOverColor下拉框中選項鼠標通過時的背景色useRollOver爲true時有效
textRollOverColor下拉框中選項鼠標通過時的文本顏色useRollOver爲true時有效
selectionColor下拉框中點擊某一行選項時的此選項背景色
textSelectedColor下拉框中點擊某一行選項時的此選項文本顏色
openDuration打開下拉框的速度數值從10~2000
closeDuration關閉下拉框的速度數值從10~2000
CheckBox組件樣式屬性(包含單選和多選)
borderColor邊框顏色
color文本顏色
textRollOverColor鼠標通過選擇框時的文本顏色
textSelectedColor鼠標點擊選擇框時的文本顏色
fillColors選擇框的背景填充色這個屬性要設置4個色彩值:漸變起始色,漸變結束色,鼠標通過時漸變起始色,鼠標通過時漸變結束色
fillAlphas填充色透明度針對fillColors屬性這個屬性要設置4個透明度漸變起始色透明度漸變結束色透明度鼠標通過時漸變起始色透明度鼠標通過時漸變結束色透明度數值從0.00~1.00
highlightAlphas高光透明度針對fillColors屬性2個數值,中間以逗號分隔前一個爲高光亮度,從0.00~1.00,爲1時最亮,爲白色後一個爲高光透明度,從0.00~1.00,爲1時最透明(可經過設置製做出水晶半透明效果)
HSlider(相似於溫度刻度計的組件HSlider爲橫向的)組件樣式屬性
labelOffset刻度值文字與刻度計之間的距離數值從-50~50負數時刻度值文字在刻度計下方正數時在上方
thumbOffset刻度計中的遊標與標尺之間的距離數值從-50~50負數時遊標在標尺下方html