Bonjour,
Débutant en Flex, j'essaye de vainement de customizer dynamiquement le header de mon Datagrid.
J'ai un Datagrid dont les colonnes + le contenu va être alimenté dynamiquement à l'aide d'un fichier XML.
Après avoir chargé mon fichier XML, je fais appel à une fonction buildTableHeader() dans laquelle je vais:
- créer dynamiquement les colonnes
- customizez le header à l'aide de l'objet ClassFactory et de mon item renderer représenté par un composant myVboxStyle1.xml
Quand j'exécute mon code, je n'ai rien dans mes headers.
Cf. ci-dessous mon code et d'avance merci pour votre aide
Pour le rendering de mon header, j'ai créé le composant suivant:
que j'utilise comme suit dans ma main application
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35 <?xml version="1.0" encoding="utf-8"?> <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" implements="mx.core.IDataRenderer"> <mx:Script> <![CDATA[ import mx.controls.Image; import mx.core.IDataRenderer; import mx.controls.LinkButton; import mx.containers.VBox; public var imgSource:String = ""; public var labelLink:String = ""; public var labelUrl:String = ""; override public function set data(value:Object):void { super.data = value; } override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void { super.updateDisplayList(unscaledWidth, unscaledHeight); visualProduct.source = imgSource; linkProduct.label = labelLink; //linkProduct.cl } ]]> </mx:Script> <mx:Image id="visualProduct" /> <mx:LinkButton id="linkProduct" /> </mx:VBox>
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77 <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initData()" verticalScrollPolicy="off" maxWidth="2000" maxHeight="700"> <mx:XML id="essai" format="e4x" source="myFileXMl.xml"> </mx:XML> <mx:Script> <![CDATA[ import mx.controls.Image; import mx.core.Container; import mx.controls.dataGridClasses.DataGridColumn; import mx.binding.utils.BindingUtils; import mx.utils.ArrayUtil; import mx.collections.*; import mx.rpc.events.ResultEvent; import myComponents.myVboxStyle1; private var personItemRendererFactory:ClassFactory; private function buildTableHeader(productId:String,productName:String,productUrl:String,productVisual:String):void { //Récupère les colonnes déjà définies var cols:Array = myProductTable.columns; //Création d'une nouvelle colonne var currentColumn:DataGridColumn = new DataGridColumn(); currentColumn.resizable = true; //currentColumn.headerText = productName; personItemRendererFactory = new ClassFactory(myVboxStyle1); personItemRendererFactory.properties = { labelLink:productName, imgSource:productVisual}; currentColumn.headerRenderer = personItemRendererFactory; cols.push(currentColumn); //Ajout de la nouvelle column myProductTable.columns = cols; } private function initData():void { //Récupération des des données du fichier XML var myList:XMLList = new XMLList(essai.PRODUCT); //Création des colonnes du tableau + les titres var item:XML; for each(item in myList) { buildTableHeader(item.attribute('id').toString(),item.attribute('label').toString(),item.attribute('url').toString(),item.attribute('visual').toString()); } } ]]> </mx:Script> <mx:VBox id="myVerticalBox"> <mx:DataGrid id="myProductTable" variableRowHeight="true" width="730" height="400" verticalGridLines="true" horizontalGridLines="true" resizableColumns="true" showHeaders="true" headerHeight="200"> <mx:columns> <mx:DataGridColumn id="firstColumn" resizable="true"/> </mx:columns> </mx:DataGrid> <mx:TextArea id="myText" height="400" width="400"/> </mx:VBox> </mx:Application>
Partager