2011-06-02 3 views
12

Puis-je avoir une grille de données qui affiche les données verticalement plutôt qu'horizontalement?Flex Vertical Datagrid

par exemple, si ceci est mon dataprovider:

array('firstname':'John','lastname':'Doe'), 
array('firstname':'Jack','lastname':'Jill') 

Je veux que les données à afficher comme ceci:

Fields  Value1 Value2 
Firstname  John  Jack 
Lastname  Doe  Jill 

et ainsi de suite .... ce qui est la meilleure façon d'atteindre ceci .. Si je dois prolonger le composant de grille de données, expliquez svp comment ..

+0

+1 bonne question, – Ryan

+0

Flex 4.5 Datagrid ou Datagrid MX? Flex 3 ou 4? –

+0

oh im sorry ... flex 4 – Lin

Répondre

4

Ainsi ceci est un bidouillage ... mais il s'avère que vous ne pouvez pas facilement changer le flux de la grille de données d'étincelle. D'après ce que je peux dire, vous auriez besoin de remplacer à peu près tous les composants à l'intérieur et cela prendrait beaucoup de temps. Le DataGrid utilise sa propre disposition et il semble très défini sur le sujet de 1 row = 1 morceau de données.

Alors ... bidouille commencerai:

<s:DataGrid rotation="270"> 
    <s:columns> 
    <s:ArrayList> 
     <s:GridColumn itemRenderer="unrotate" headerRenderer="headerUnrotate"/> 
     <s:GridColumn itemRenderer="unrotate" headerRenderer="headerUnrotate"/> 
    </s:ArrayList> 
    </s:columns> 
</s:DataGrid> 

D'accord ... qu'est-ce que je fais? Je fais juste pivoter le DataGrid entier. Comment puis-je le réparer pour ne pas avoir à incliner la tête? Je dé-rotation chaque colonne dans l'itemrenderer. HOLY HACK batman.

est ici l'élément unrotate renderer:

<?xml version="1.0" encoding="utf-8"?> 
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true"> 

<fx:Script> 
    <![CDATA[ 
     override public function prepare(hasBeenRecycled:Boolean):void { 
      lblData.text = data[column.dataField] 
     } 
    ]]> 
</fx:Script> 

<s:Label id="lblData" top="9" left="7" rotation="90"/> 

</s:GridItemRenderer> 

Le code d'en-tête est similaire, tourner juste 90 pour revenir à l'endroit où nous avons commencé. Je sais que cette solution est loin d'être parfaite, mais c'est le meilleur que je puisse penser sans complètement se tromper avec la classe DataGrid

Vous avez probablement aussi besoin de surcharger l'apparence pour fournir un en-tête WIDER ... qui est en fait un en-tête TALLER depuis nous sommes tournés à 270 degrés. Autre alors que cela devrait effectivement fonctionner ...