常見Flex樣式定義型別

2021-08-31 14:50:22 字數 2074 閱讀 5921

flex樣式定義型別

1.外部flex樣式表

<

mx:stylesource

mx:stylesource = '/css/mystyle.css'

/>

flex會呼叫全域性flex樣式表global.css,該全域性flex樣式表由flex-config.xml定義,如:

<

global-css-url

> /web-inf/flex/global.css

global-css-url

>

系統預設的flex樣式表檔案global.css檔案其實沒有任何flex樣式定義,我們可以手動新增全域性flex樣式,也可以更改預設的全域性flex樣式檔案路徑。如,把全域性flex樣式檔案該為:

<

global-css-url

> /css/styles.css

global-css-url

>

在這裡順便提一點,定義外部css檔案的時候,顏色flex樣式有四種定義方式:

1:.myclass//16進製制顏色格式

2:.myclass//rgb顏色格式

3:.myclass//10進製rgb顏色格式

4:.myclass//vga顏色名稱格式

2.本地flex樣式定義

使用來定義當前檔案的flex樣式

下面的例子定義了myfontstyle子類flex樣式,要使用對應的flex樣式可以在元件中使用stylename屬性來應用flex樣式。

1. <

mx:style

>

2..myfontstyle  

3. mx:style

>

4. <

mx:buttonid

mx:buttonid ='mybutton' stylename ='myfontstyle' label = 'clickhere'

>

下面的flex樣式則定義了所有button元件的flex樣式,使用該方式定義的flex樣式在使用的時候不需要指定flex樣式名。

1. <

mx:style

>

2.button  

3. mx:style

>

4. <

mx:buttonid

mx:buttonid ='mybutton' label ='clickhere' >

3.內嵌flex樣式定義

對個別需要特殊處理的元件,可以使用下面的方式進行內嵌flex樣式定義

<

mx:buttonid

mx:buttonid ='mybutton' fontsize ='15' color ='0x9966cc' label ='mybutton' />

4.使用指令碼flex樣式定義

這種方法使用了flash傳統的as指令碼方式來定義flex樣式,具有更強大的靈活性,並且可以使用stylemanager類以及getstyle()和setstyle()方法,如下所示:

1. <

mx:script

>

2. 3.//使用stylemanger類

4.mx.styles.stylemanager.styles.tooltip.fontweight='bold';

5.//獲取元件flex樣式

6.lb1.text=ip1.getstyle('fontsize');

7.//設定元件flex樣式

8.lb1.text=ip1.setstyle('fontsize',newsize);

9.]]>

10.

mx:script

>

如果三種flex樣式定義方式同時使用的話,優先級別從高到低依次為:內嵌式flex樣式》本地flex樣式定義(指令碼flex樣式定義)>外部flex樣式定義。

flex自定義進度條樣式

進度條內部 xmlns s library override protected function initializationcomplete void 進度條外部 xmlns s library minheight 13 override protected function initializ...

Flex樣式表自定義 css

第一 先在配置檔案中加入引用的樣式表 第二 在defaults.css中寫自己要增加的樣式 infosymbolstyle1 第三 在專案功能處引用 紅色標註部分即為引用 繪製柱狀圖 private function drawingzhuzhuangtu cityarr array,dataarr ...

Flex程式設定樣式

flex 程式支援以下方式設定樣式 1 外部樣式表 css檔案 2.在程式中新增樣式定義塊 3 使用 mxml 標籤定義樣式,這是效率最高的方式,只針對目標物件,不需要編寫其他 4 使用 getstyle 和setstyle 方法,它們通常用於在執行時動態改變元件的樣式。5 使用 stylemana...