在學(xué)習(xí)Flex的過程中，你會(huì)遇到Flex DataGrid組件用法的問題，這里和大家分享一下使用Flex DataGrid組件顯示數(shù)據(jù)列表，顯示數(shù)據(jù)列表是Flex DataGrid組件最基本的應(yīng)用，只有把數(shù)據(jù)顯示出來(lái)，才可以實(shí)現(xiàn)其他的功能。

使用Flex DataGrid組件顯示數(shù)據(jù)列表

顯示數(shù)據(jù)列表是Flex DataGrid組件最基本的應(yīng)用，只有把數(shù)據(jù)顯示出來(lái)，才可以實(shí)現(xiàn)其他的功能。數(shù)據(jù)的來(lái)源大概有兩種，一種是內(nèi)部數(shù)據(jù)，即在程序內(nèi)部自定義數(shù)據(jù)，然后綁定到Flex DataGrid組件中；另一種是外部數(shù)據(jù)，通過讀取外部文件或者是數(shù)據(jù)庫(kù)，綁定到Flex DataGrid組件中。接下來(lái)，就這兩種情況分別做介紹。

將外部數(shù)據(jù)綁定到Flex DataGrid組件中

外部數(shù)據(jù)通常指的是數(shù)據(jù)庫(kù)、文本本件和XML文件。在實(shí)際開發(fā)中，與數(shù)據(jù)層傳入數(shù)據(jù)大多是通過XML格式傳輸?shù)?。所以，下面就?chuàng)建一個(gè)讀取外部XML文件的數(shù)據(jù)，然后在Flex DataGrid組件中顯示的例子，步驟如下：

◆步驟一：創(chuàng)建一個(gè)XML文件，命名為DataGrid_Data.xml，內(nèi)容結(jié)構(gòu)如下所示：
 

<?xmlversionxmlversion="1.0"encoding="UTF-8"?> 
<root> 
<nodelabelnodelabel="Flash"> 
<Name>Flash</Name> 
<Company>Adobe</Company> 
<Version>9.0</Version> 
</node> 
<nodelabelnodelabel="Java"> 
<Name>Java</Name> 
<Company>Sun</Company> 
<Version>6.0</Version> 
</node> 
<nodelabelnodelabel=".Net"> 
<Name>.Net</Name> 
<Company>Microsoft</Company> 
<Version>2.0</Version> 
</node> 
<nodelabelnodelabel="Flex"> 
<Name>Flex</Name> 
<Company>Adobe</Company> 
<Version>2.0</Version> 
</node> 
<nodelabelnodelabel="OICQ"> 
<Name>OICQ</Name> 
<Company>騰訊</Company> 
<Version>2007</Version> 
</node> 
</root> 

 #p#

◆步驟二;繼續(xù)使用15.2.1節(jié)的文件，在DataGrid_ShowData_Example.as文件中，創(chuàng)建一個(gè)名為GetData2的函數(shù)，在函數(shù)中讀取剛才創(chuàng)建的XML文件，代碼如下所示：

*********************************  
*加載外部XML數(shù)據(jù)  
**/  
privatefunctionGetData2():void  
{  
//加載外部XML文件  
data_xml=newXML();  
myXMLURL=newURLRequest("DataGrid_Data.xml");  
myLoader=newURLLoader(myXMLURL);  
}  

 ◆步驟三：在類的外部，引入剛才使用的命名空間，包括URLRequest和URLLoader，代碼如下：
 

importflash.net.URLRequest;  
importflash.net.URLLoader;  

 
◆步驟四：創(chuàng)建上面的全局變量，data_xml、myXMLURL和myLoader。代碼如下所示：
 

privatevardata_xml:XML;  
privatevarmyXMLURL:URLRequest;  
privatevarmyLoader:URLLoader; 

◆步驟五：創(chuàng)建XML對(duì)象的加載文件事件，并且在GetData2函數(shù)中添加偵聽事件的語(yǔ)句，添加的偵聽語(yǔ)句代碼如下：
 

myLoader.addEventListener("complete",xmlLoaded);  
XML對(duì)象的加載文件事件函數(shù)代碼如下：  
/*********************************  
*綁定Flex DataGrid組件  
**/  
functionxmlLoaded(event:Event):void  
{  
data_xml=XML(myLoader.data);  
//trace(data_xml.elements("node").toXMLString());  
}  

 #p#◆步驟六：在偵聽事件函數(shù)中，把從外部讀取的數(shù)據(jù)文件綁定到Flex DataGrid組件中，代碼如下：
 

//DataProvider  
vardp:DataProvider=newDataProvider(data_xml);  
 
//初始化Flex DataGrid組件，并實(shí)例化  
vardg2:DataGrid=newDataGrid();  
//設(shè)置寬和高  
dg2.setSize(200,300);  
//定義列的標(biāo)題  
dg2.columns=["Name","Company","Version"];  
//綁定數(shù)據(jù)源  
dg2.dataProvider=dp;  
addChild(dg2);  
 

***，在構(gòu)造函數(shù)中，調(diào)用GetData2函數(shù)，代碼如下：
 

/*****************************************  
*構(gòu)造函數(shù)  
**/  
publicfunctionDataGrid_ShowData_Example()  
{  
GetData2();  
}  

 ◆步驟七：編譯代碼并運(yùn)行。

【編輯推薦】

1. 探秘Flex與JavaScript交互
2. 常用FlexBuilder快捷鍵用法指導(dǎo)
3. Flex框架Riawave的定制應(yīng)用
4. 技術(shù)前沿 Flex2.0 從零開始實(shí)現(xiàn)文件上傳
5. 學(xué)習(xí)筆記 如何將內(nèi)部數(shù)據(jù)綁定到Flex DataGrid組件中