Flex - Vertical Align Cells in a Datagrid

Question

I'm having trouble vertical aligning text inside cells in a DataGrid in Flex. I tried this.setStyle("vertical-align", "middle) in an itemRenderer on the column but it doesn't seem to work... I tried verticalAlign as well.

Answer 1

Try textAlign on the DataGridColumn.

Answer 2

Do you not think this would have been the first thing I tried? Anyways, figured out the solution, looks like flex doesn't support it natively but I found a hack to do the job.

Make the cells inherit a Box and put a label inside the box. Then you can set verticalAlign="middle" on the Box.

Answer 3

The mx:Text and TextField controls do not directly support a verticalAlign style.

The easiest would be to align the contents of their container e.g. container.setStyle("verticalAlign", "bottom") or so.

If the container uses absolute layout, you could set one of top, bottom, left, right styles to 0, to align accordingly.

Answer 4

Use the DataGrid verticalAlign property (set to "middle")

verticalAlign: The vertical alignment of a renderer in a row

http://www.adobe.com/livedocs/flex/2/langref/mx/controls/DataGrid.html#styleSummary