CODEWITHSUNDEEP
apache-flexviewadobe
foobarfuzzbizz
foobarfuzzbizz

Reputation: 58637

How can I evenly distribute columns in a DataGrid in Flex?

I have 16 columns in a DataGrid in my Flex app. The first 15 look fine, with the column, simply containing the text, but the last one has a lot of extra space. Essentially, the columns are just big enough to fit the first 15 and all that extra space is tacked onto the 16th column.

How can I evenly distribute the space over each column?

<mx:DataGrid x="127" y="9" id="view"
                 dataProvider = "{currentBuffer}" width="497" height="480">
        <mx:columns>
            <mx:DataGridColumn headerText="0" dataField="col0" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="1" dataField="col1" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="2" dataField="col2" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="3" dataField="col3" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="4" dataField="col4" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="5" dataField="col5" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="6" dataField="col6" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="7" dataField="col7" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="8" dataField="col8" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="9" dataField="col9" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="A" dataField="colA" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="B" dataField="colB" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="C" dataField="colC" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="D" dataField="colD" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="E" dataField="colE" draggable="false" sortable="false" resizable="false"/>
            <mx:DataGridColumn headerText="F" dataField="colF" draggable="false" sortable="false" resizable="false"/>
        </mx:columns>
    </mx:DataGrid>

Upvotes: 1

Views: 483

Answers (2)

Amarghosh
Amarghosh

Reputation: 59451

Set the width of each column to 6.25% - of give 6% to first 15 and 10% to the last one.

Upvotes: 0

JeffryHouser
JeffryHouser

Reputation: 39408

Have you tried manually setting the width on the columns using the width property?

You could easily use updateDisplayList to calculate the size of each column, either by creating your own wrapper component or by extending the DataGrid.

Upvotes: 1

Related Questions