FLEX3中應用CSS完全詳解手冊(2)

來源:互聯網
上載者:User

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的樣式。

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.