Populating a Datagrid with variable number of columns and rows in Flex

I am trying to figure out how to manage a Datagrid based on an XML object like this:

<matrix rows="5" columns="5">
<column>
    <row>0.5</row>
    <row>0.21</row>
</column>
<column>
    <row>0.6</row>
    <row>0.9</row>
</column>
<column>
    <row>0.5</row>
    <row>0.5</row>
</column>
<column>
    <row>0.8</row>
    <row>0.4</row>
</column>
</matrix>

I will need to populate the Datagrid column names based on a different XML object and use the above XML to populate each of the column's rows. I currently am able to开发者_如何学Python create the Datagrid and populate its column headers but I am unsure as to how to how to add the rows for each column. The above XML will be update with new row and column elements added and deleted. This, of course, will be bound to the Datagrid to show updates.

Is it necessarily true that the row data is child of the column? You will need to transform the data first if this is the case. DataGrid in Flex and Table in HTML are based on the convention of databases with rows as individual records, not columns.

If whom/whatever is providing the data refuses to comply with this, you'd be better to manipulate the data to suit the view control rather than vice versa, which is what you seem to be doing now.

The rows of a datagrid will be dynamic. It will be populated based on the number of items in the data provider. But to make columns dynamic you have to do it using AS.

Datagrid has a property called "columns". this contains the DataGridColumn objects for that datagrid. You can check the dataprovider and add or remove DatagridColumns to the "columns" Array.

var cols:Array = [];
for(var i:int = 0;i<dataProvider.length;i++)
{
   var DGCol:DataGridColumn = new DataGridColumn();
   DGCol.dataField = "data1";
   cols.push(DGCol);
}
myDg.columns = cols;