ADOBE FLEX 3
Adobe Flex 3 Data Visualization Developer Guide
289
Any object that implements the ICollectionView interface is represented internally by the AdvancedDataGrid
control as an instance of the ICollectionView interface.
An object of any other data type is wrapped in an Array instance with the object as its sole entry.
For example, you use an Array to create an instance of the HierarchicalData class, and then pass that
HierarchicalData instance to the
AdvancedDataGrid.dataProvider property. If you read the data back from the
AdvancedDataGrid.dataProvider property, it is returned as an ArrayCollection instance.
Calling validateNow() after setting the data provider
In some situations, you may set the data provider of the AdvancedDataGrid control to hierarchical or grouped data,
and then immediately try to perform an action based on the new data provider. This typically occurs when you set
the
dataProvider property in ActionScript, as the following example shows:
adg.dataProvider = groupedCollection;
adg.expandAll();
In this example, the call to expandAll() fails because the AdvancedDataGrid control is in the process of setting the
dataProvider property, and the expandAll() method either processes the old value of the dataProvider
property, if one existed, or does nothing.
In this situation, you must insert the
validateNow() method after setting the data provider. The validateNow()
method validates and updates the properties and layout of the control, and then redraws it, if necessary. The
following example inserts the
validateNow() method before the expandAll() method:
adg.dataProvider = groupedCollection;
adg.validateNow();
adg.expandAll();
Do not insert the validateNow() method every time you set the dataProvider property because it can affect the
performance of your application; it is only required in some situations when you attempt to perform an operation
on the control immediately after setting the
dataProvider property.
Controlling the navigation tree of the AdvancedDataGrid control
The AdvancedDataGrid control is sometimes referred to as a tree datagrid because a column of the control uses an
expandable tree to determine which rows are currently visible in the control. Often, the tree appears in the left-most
column of the control, where the first column of the control is associated with a field of the controls data provider.
That data field of the data provider provides the text for the labels of the tree nodes.
In the following example, you populate the AdvancedDataGrid control with the hierarchal data structure shown in
“Hierarchical and grouped data display” on page 287. The data contains a top-level object that contains a Region
field, and multiple second-level children. Each second-level child also contains a Region field and one or more
children.
The AdvancedDataGrid control in this example defines four columns to display the data: Region, Territory Rep,
Actual, and Estimate.
<?xml version="1.0"?>
<!-- dpcontrols/adg/SimpleHierarchicalADG.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
include "SimpleHierarchicalData.as";
]]>
</mx:Script>
ADOBE FLEX 3
Adobe Flex 3 Data Visualization Developer Guide
290
<mx:AdvancedDataGrid width="100%" height="100%">
<mx:dataProvider>
<mx:HierarchicalData source="{dpHierarchy}"/>
</mx:dataProvider>
<mx:columns>
<mx:AdvancedDataGridColumn dataField="Region"/>
<mx:AdvancedDataGridColumn dataField="Territory_Rep"
headerText="Territory Rep"/>
<mx:AdvancedDataGridColumn dataField="Actual"/>
<mx:AdvancedDataGridColumn dataField="Estimate"/>
</mx:columns>
</mx:AdvancedDataGrid>
</mx:Application>
The following image shows the AdvancedDataGrid control created by this example. The control displays a folder
icon to represent branch nodes of the tree, and a file icon to represent leaf nodes. The first column of the control is
associated with the Region field of the data provider, so the tree labels display the value of the Region field.
Notice that the leaf icon for the tree does not show a label. This is because the individual records for each territory
representative do not contain a Region field.
While the tree is often positioned in the left-most column of the control, you can use the
treeColumn property to
specify any column in the control, as the following example shows:
<?xml version="1.0"?>
<!-- dpcontrols/adg/HierarchicalADGCategoriesTreeColumn.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
include "HierarchicalDataCategories.as";
]]>
</mx:Script>
<mx:AdvancedDataGrid
width="100%" height="100%"
treeColumn="{rep}">
<mx:dataProvider>
<mx:HierarchicalData source="{dpHierarchy}"
childrenField="categories"/>
</mx:dataProvider>
<mx:columns>
<mx:AdvancedDataGridColumn dataField="Region"/>
<mx:AdvancedDataGridColumn id="rep"

Get ADOBE® FLEX® 3: ADVANCED DATA VISUALIZATION DEVELOPER GUIDE now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.