定義Flex DataGrid組件樣式外觀方法指導(dǎo)
在學(xué)習(xí)Flex的過程中，你可定會(huì)用到Flex DataGrid組件，這里和大家分享一下如何定義Flex DataGrid組件樣式外觀，在實(shí)際程序開發(fā)中，有時(shí)候需要對(duì)Flex DataGrid組件可視化的外觀進(jìn)行修改，以滿足功能需要。
定義Flex DataGrid組件樣式外觀
在實(shí)際程序開發(fā)中，有時(shí)候需要對(duì)Flex DataGrid組件可視化的外觀進(jìn)行修改，以滿足功能需要。例如，修改數(shù)據(jù)顯示格式、修改DataGrid的樣式和外觀、自定義單元格等。
修改數(shù)據(jù)顯示格式
當(dāng)Flex DataGrid組件顯示出數(shù)據(jù)后，有些數(shù)據(jù)格式可能不是我們所需要的。這個(gè)時(shí)候，就要修改數(shù)據(jù)格式，把數(shù)據(jù)修改成有意義的，可以使讀者更容易讀懂的格式。比如貨幣格式前面要加美元符號(hào)或者人民幣符號(hào)，有時(shí)候從數(shù)據(jù)庫中讀出的是0或1的布爾值，再比如電話號(hào)碼等。
下面就以15.2.1節(jié)的實(shí)例為例，把Phone列修改成前面有區(qū)號(hào)的電話號(hào)碼，步驟如下。
◆修改GetData1函數(shù)，在綁定數(shù)據(jù)源的語句之后，增加格式化語句，增加的代碼如下所示：
- //格式化數(shù)據(jù)
- dg1.getColumnAt(1).labelFunction=phoneFormatter;
◆phoneFormatter是格式化數(shù)據(jù)的函數(shù)，把電話號(hào)碼前面加上區(qū)號(hào)“0755”，代碼如下所示：
- /*********************************
- *格式化電話號(hào)碼
- **/
- privatefunctionphoneFormatter(item:Object):String
- {
- return"0755-"+item.Phone;
- }
再次編譯代碼并運(yùn)行。
自定義Flex DataGrid組件的標(biāo)題
在顯示完Flex DataGrid組件的數(shù)據(jù)之后，有時(shí)候列的標(biāo)題是數(shù)據(jù)庫中已經(jīng)定義好的列名稱，對(duì)于用戶來說，不容易讀懂，需要重新定義，那就需要自定義Flex DataGrid組件的標(biāo)題了。自定義標(biāo)題要用到的類是HeaderRenderer，HeaderRenderer類在類dataGridClasses中。下面就利用HeaderRenderer類來實(shí)現(xiàn)自定義標(biāo)題的功能。
還是以15.2.1節(jié)的實(shí)例為基礎(chǔ)，加一些代碼。在GetData1函數(shù)中加入如下代碼：
- //自定義標(biāo)題
- vardgc0:DataGridColumn=dg1.getColumnAt(0);
- dgc0.headerText="姓名";
- vardgc1:DataGridColumn=dg1.getColumnAt(1);
- dgc1.headerText="電話";
- vardgc3:DataGridColumn=dg1.getColumnAt(3);
- dgc3.headerText="軟件名稱";
代碼的作用是把第一行的標(biāo)題改成“姓名”，第二行的標(biāo)題改為“電話”，第三行的標(biāo)題改為“軟件名稱”。
【編輯推薦】
- 探秘Flex與JavaScript交互
- 常用FlexBuilder快捷鍵用法指導(dǎo)
- Flex框架Riawave的定制應(yīng)用
- 技術(shù)前沿 Flex2.0 從零開始實(shí)現(xiàn)文件上傳
- FlexBuilder開發(fā)方法及特點(diǎn)解析
