CODEWITHSUNDEEP
apache-flexdatagridvertical-alignment
heri0n
heri0n

Reputation: 1489

Flex - Vertical Align Cells in a Datagrid

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.

Upvotes: 2

Views: 12240

Answers (5)

heri0n
heri0n

Reputation: 1489

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.

Upvotes: -1

flexnewbie
flexnewbie

Reputation: 21

try use <s:HorizontalLayout verticalAlign="middle">:


<s:GridColumn headerText="Action" >
 <s:itemRenderer>
   <fx:Component>
     <s:GridItemRenderer>
       <s:layout>
      <s:HorizontalLayout verticalAlign="middle" paddingLeft="5"/>
    </s:layout>
    <s:Button label="View"  click="outerDocument.view(event)" />
    <s:Button label="Unlink" click="outerDocument.unlink(event)"  />
  </s:GridItemRenderer> 
  </fx:Component>
</s:itemRenderer>    
</s:GridColumn>

Upvotes: 2

trace
trace

Reputation: 361

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

Upvotes: 1

Mario Ruggier
Mario Ruggier

Reputation: 926

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.

Upvotes: 1

jedameron
jedameron

Reputation: 1

Try textAlign on the DataGridColumn.

Upvotes: 0

Related Questions