Apache Adobe Flex TutorialTutoriaux Adobe Flex & AIR en Français

Flex AdvancedDataGrid – Les fonctionnalités du composant AdvancedDataGrid

Le composant Flex AdvancedDataGrid étend les possibilités du composant DataGrid standard pour pouvoir mieux représenter votre donnée. On a ainsi un meilleur contrôle sur l'affichage, les regroupements et le formatage.

Voici les principales fonctionnalités de l'AdvancedDataGrid:

• Tri sur plusieurs colonnes: Trier votre données selon plusieurs critères en cliquant sur les en-têtes de colonne.
• Appliquer un style sur les lignes et les colonnes: En utilisant le propriété styleFunction, vous pourrez spécifier un fonction qui va déterminer le style à appliquer aux lignes/colonnes du composant
• Affichage de données groupées/hiérarchiques: Vous pouvez intégrer un arbre dans un colonne pour contrôler quelles lignes doivent être affichées
• Regroupement de colonnes: Regroupez la donnée de plusieurs colonnes dans une seule en-tête
• Utilisation d'ItemRenderers: Avec l'AdvancedDataGrid, vous pourrez afficher une seule donnée sur plusieurs colonnes ou utilisez plusieurs item renderer pour la même colonne.
• Possibilité de ré-ordonner et de redimensionner les colonnes de la table

Affichage de données groupées/hiérarchiques

Un des aspects les plus importants du composant AdvancedDataGrid est le support des données hiérarchiques ou groupées. Une donnée dite hiérarchique est une donnée déjà structurée avec des éléments parents et enfants. Une donnée dite groupée est une donnée "à plat" (flat) sans hiérarchie. Avant de passer cette donnée à plat au composant AdvancedDataGrid, pour pouvez spécifier un ou plusieurs champ qui vont être utilisés pour grouper la donnée.

Pour supporter l'affichage d'une donnée hiérarchique ou groupée, le composant AdvancedDataGrid intègre une arbre de navigation dans une colonne. L'exemple suivant montre un composant AdvancedDataGrid avec un arbre de navigation dans la première colonne qui contrôle les lignes visibles du composant.

Regroupement de colonnes (exemple MXML)

Le regroupement de colonne (column grouping) vous permet de rassembler de multiples colonnes sous une seule en-tête. L'exemple suivant regroupe les colonnes Actual et Estimate sous l'en-tête Revenues:

Le composant AdvancedDataGrid est définit par la classe mx.controls.AdvancedDataGrid et par les classes additionnelles du package mx.controls.advancedDataGridClasses. Ce package inclut la classe AdvancedDataGridColumn que vous allez utiliser pour définir les colonnes.

Le code MXML suivant crée les colonnes groupées telles qu'elles le sont dans l'image précédente:

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:Script>
	<![CDATA[
		import mx.collections.ArrayCollection;
		// Import the data used by the AdvancedDataGrid control.
		include "SimpleFlatData.as";
	]]>
	</mx:Script>

	<mx:AdvancedDataGrid id="myADG"
		dataProvider="{dpFlat}"
		width="100%" height="100%">
		<mx:groupedColumns>
			<mx:AdvancedDataGridColumn dataField="Region"/>
			<mx:AdvancedDataGridColumn dataField="Territory"/>
			<mx:AdvancedDataGridColumn dataField="Territory_Rep"
			headerText="Territory Rep"/>
			<mx:AdvancedDataGridColumnGroup headerText="Revenues">
				<mx:AdvancedDataGridColumn dataField="Actual"/>
				<mx:AdvancedDataGridColumn dataField="Estimate"/>
			</mx:AdvancedDataGridColumnGroup>
		</mx:groupedColumns>
	</mx:AdvancedDataGrid>
</mx:Application>

Migration depuis le composant DataGrid

A part les nouvelles fonctionnalités apportées, le composant AdvancedDataGrid ajoute la propriété suivante:

• firstVisibleItem: Spécifie l'item qui est affichée en première ligne du composant ADG.

Voir la liste complète des propriétés et méthodes du composant AdvancedDataGrid (livedocs)

Si vous aviez une application utilisant le composant DataGrid et que vous voulez utiliser un AdvancedDataGrid, prenez garde aux évènements propagés. Ils seront de type AdvancedDataGridEvent et non plus DataGridEvent. Si votre application référence cet objet avec son type, vous devez mettre à jour votre application pour utiliser le bon type de donnée