Flex datagrid multiple rows single file

Question

Hi, I have a flex datagrid with 3 columns. The first column contains the image name(unique key). The other two columns have username and size details. I want to split the username into lastname, firstname, address and some other stuff.
Can we have multiple rows in the grid for one image? Tried multi-line, it works but we need to keep adding spaces and its cumbersome. Since each row in the flex datagrid is represented by one index in the XMLList which is enumerated, is there a way to have more than one row assigned to one image and shown in the grid? something like this..

Thanks, Vish.

Answer 1

Use a custom itemRenderer for the user column. Here is a sample code snippet, you might want to modify it based on the structure of your dataProvider

<mx:DataGrid id="dg" width="100%" height="100%" dataProvider="{dp}">
    <mx:columns>
            <mx:DataGridColumn dataField="image" headerText="Image"/>
            <mx:DataGridColumn dataField="user" headerText="User" >
              <mx:itemRenderer>
                <mx:Component>
                  <mx:VBox>
                    <mx:Label text="{data.firstName}"/>
                    <mx:Label text="{data.lastName}"/>
                    <mx:Text text="{data.address}"/>
                  </mx:VBox>
                </mx:Component>
              </mx:itemRenderer>
            </mx:DataGridColumn>
            <mx:DataGridColumn dataField="size" headerText="Size"/>
    </mx:columns>
</mx:DataGrid>