Saturday, February 9, 2008

AIR - XMLデータをデータグリッドに読み込むサンプル



前回のサンプルに続き、今回は読み込んだXMLデータをデータグリッドに読み込みたいと思います。データグリッドへのXMLデータの読み込み方法はとてもシンプルです。

データグリッドコンポーネントを用意したら、そのデータグリッドのdataProviderを設定し、各カラムのdateFieldをXMLデータと関連付けすれば完了です。


<?xml version="1.0" encoding="utf-8"?>

<set>

<sample>

<id>001</id>

<name>Taro</name>

<age>20</age>

</sample>

<sample>

<id>002</id>

<name>Hanako</name>

<age>22</age>

</sample>

<sample>

<id>003</id>

<name>Jiro</name>

<age>25</age>

</sample>

<sample>

<id>004</id>

<name>Yoshio</name>

<age>21</age>

</sample>

</set>



例えば、上のようなXMLデータのsample部分のデータをデータグリッドに読み込みたい場合、データグリッドのdataProviderは次のようになります。


<mx:DataGrid dataProvider="{rXML.sample}">



あとは、各カラムのdataFieldをXMLデータに応じて設定していきます。今回の例では、id、name、ageのデータを読み込みたいので、以下のように設定します。


<mx:DataGridColumn headerText="ID" dataField="id"/>

<mx:DataGridColumn headerText="Name" dataField="name"/>

<mx:DataGridColumn headerText="Age" dataField="age"/>



これで、完了です。

今回のコード:


<?xml version="1.0" encoding="utf-8"?>

<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

<mx:Script>

<![CDATA[



public var sampleXML:File;

public var stream:FileStream;

public var loadFile:File;



[Bindable]public var rXML:XML;



private function loadSampleXML():void

{



sampleXML = File.applicationDirectory;

sampleXML = sampleXML.resolvePath("sample.xml");

//loadFile = new File("file:///C:/sample.xml");



stream = new FileStream();



stream.open(sampleXML, FileMode.READ);

//stream.open(loadFile, FileMode.READ);

rXML = XML(stream.readUTFBytes(stream.bytesAvailable));

stream.close();

trace("XML data: "+rXML.sample);

}



]]>

</mx:Script>



<mx:VBox x="0" y="0" width="100%" height="100%">

<mx:Button label="Click Me" click="loadSampleXML();"/>

<mx:DataGrid dataProvider="{rXML.sample}">

<mx:columns>

<mx:DataGridColumn headerText="ID" dataField="id"/>

<mx:DataGridColumn headerText="Name" dataField="name"/>

<mx:DataGridColumn headerText="Age" dataField="age"/>

</mx:columns>

</mx:DataGrid>

</mx:VBox>



</mx:WindowedApplication>



今回のサンプルファイルはこちらからダウンロードできます。

なお、任意のパスからXMLファイルを読み込みたい場合は、以下のような設定になります。


public var loadFile:File;

.

.

.

.

loadFile = new File("file:///C:/sample.xml");

.

.

.

.

stream.open(loadFile, FileMode.READ);



ポイントとしては、


sampleXML = File.applicationDirectory;

sampleXML = sampleXML.resolvePath("sample.xml");


の代わりに任意のパスを指定する


loadFile = new File("file:///C:/sample.xml");


を設定することです。

また、stream.openではsampleXMLの代わりにloadFileを使用すればOKです。

No comments: