DataGrid Column Header
Flash MX 2004 et Flash 8
Cet exemple montre l'ajout de nouvelles propriétés pour modifier le style du header du composant DataGrid.
Ces propriétés de style permettent de définir un header :
- avec une couleur normale (sans gradient)
- avec des bords arrondis.
Voici un exemple avec l'utilisation des nouvelles propriétés.
dgheader.zip (303
Ko)
Explication
Une "bonne" pratique serait de définir une sous-classe en redéfinissant les méthodes et d'intégrer cette sous-classe dans l'environnement de développement. Ceci est compliqué voir impossible.
On effectue, donc, les modifications par des patchs sur des méthodes du composant DataGrid. Le code est fourni mais vous trouverez des explications supplémentaires sur cette méthode dans le blob d'ericd.net.
La modification des méthodes s'effectue de la façon suivante (ici pour la méthode drawHeaderBG). N'oubliez pas de préfixer les variables/attributs par this.
mx.controls.DataGrid["prototype"]["drawHeaderBG"]
= function () {
// votre code
};
Le patch consiste à utiliser les méthodes standards du composant DataGrid (dans les cas standards) et à prendre en compte l'utilisation des nouvelles propriétés de style. Les patchs sont regroupés dans le fichier dgHeaderPatch.as.
Voici une mini-doc des nouvelles propriétés :
| Style | Description |
|---|---|
| headerUIStyle | The style of the column header : either "normal", "solid", or "roundcorner". The default value is "normal". If the value is "roundcorner", the borderStyle of the datagrid must be "none" [datagrid.setStyle("borderStyle" , "none");] |
| headerSelectionColor | The color of header when the mouse pointer rolls over it. |
| headerBottomColor | The color of the separator between the header and the rows. |
| headerBackgroundColor | The background color of the header when the headerUIStyle is "roundcorner". The default color is white |
Extension
Vous pouvez étendre facilement le code si vous voulez d'autres méthodes de dessin du header (par exemple, avec des gradients de couleur horizontaux).
Vous pouvez aussi consulter l'exemple 'Modifier le style d'un DataGrid' qui montre d'autres propriétés de style d'un DataGrid.