[flexcoders] DataGrid column resizing
I've been slamming my head against my desk for the last day trying to
figure out how to resize DataGrid columns and I'm hoping somebody can
help me out. I'm using Flex 2.0.1. Any help will be much appreciated!
The idea here is that onCreationComplete the DataGridColumns will
recreate themselves based off of a certain size, eventually the length
of the data inside of them. I've gotten this to work with every
attribute except width. (labelFunctions, itemRenderers, etc.)
mx:Script
![CDATA[
private var gridData:Array = [
{ symbol: ADBE, name: Adobe Systems Inc., price: 49.95 },
{ symbol: MACR, name: Macromedia Inc., price: 39.95 },
{ symbol: MSFT, name: Microsoft Corp., price: 25.95 },
{ symbol: IBM, name: IBM Corp., price: 42.55 }
];
public function resizeGridColumns(gridId:Object):void {
var oldColumns:Array = gridId.columns;
var numberOfColumns:int = oldColumns.length;
var newColumns:Array = new Array();
for(var i:int = 0; i numberOfColumns; i++){
var oldColumn:DataGridColumn = (oldColumns[i] as DataGridColumn);
var newColumn:DataGridColumn = new DataGridColumn;
newColumn.dataField = oldColumn.dataField;
newColumn.headerText = oldColumn.headerText+-dynamic;
newColumn.width = 50;
newColumns.push(newColumn);
}
gridId.columns = newColumns;
}
]]
/mx:Script
mx:DataGrid id=grid
initialize=grid.dataProvider = gridData
creationComplete=resizeGridColumns(grid)
width=500
mx:columns
mx:DataGridColumn headerText=Name dataField=name /
mx:DataGridColumn headerText=Symbol dataField=symbol /
mx:DataGridColumn headerText=Price dataField=price /
/mx:columns
/mx:DataGrid
I just can't figure out how to set a column width on the fly.
Thanks!
--Brian Leach, [EMAIL PROTECTED]
Re: [flexcoders] DataGrid column resizing
Did you try doing DataGrid(gridId).setActualSize(); or just extend the
dataGridColumn and override the mx_internal that calculates the width.
- Original Message
From: brileach [EMAIL PROTECTED]
To: flexcoders@yahoogroups.com
Sent: Wednesday, January 16, 2008 2:50:30 PM
Subject: [flexcoders] DataGrid column resizing
I've been slamming my head against my desk for the last day trying to
figure out how to resize DataGrid columns and I'm hoping somebody can
help me out. I'm using Flex 2.0.1. Any help will be much appreciated!
The idea here is that onCreationComplete the DataGridColumns will
recreate themselves based off of a certain size, eventually the length
of the data inside of them. I've gotten this to work with every
attribute except width. (labelFunctions, itemRenderers, etc.)
mx:Script
![CDATA[
private var gridData:Array = [
{ symbol: ADBE, name: Adobe Systems Inc., price: 49.95 },
{ symbol: MACR, name: Macromedia Inc., price: 39.95 },
{ symbol: MSFT, name: Microsoft Corp., price: 25.95 },
{ symbol: IBM, name: IBM Corp., price: 42.55 }
];
public function resizeGridColumns( gridId:Object) :void {
var oldColumns:Array = gridId.columns;
var numberOfColumns: int = oldColumns.length;
var newColumns:Array = new Array();
for(var i:int = 0; i numberOfColumns; i++){
var oldColumn:DataGridC olumn = (oldColumns[ i] as DataGridColumn) ;
var newColumn:DataGridC olumn = new DataGridColumn;
newColumn.dataField = oldColumn.dataField ;
newColumn.headerTex t = oldColumn.headerTex t+-dynamic ;
newColumn.width = 50;
newColumns.push( newColumn) ;
}
gridId.columns = newColumns;
}
]]
/mx:Script
mx:DataGrid id=grid
initialize= grid.dataProvide r = gridData
creationComplete= resizeGridColum ns(grid)
width=500
mx:columns
mx:DataGridColumn headerText= Name dataField=name /
mx:DataGridColumn headerText= Symbol dataField=symbol /
mx:DataGridColumn headerText= Price dataField=price /
/mx:columns
/mx:DataGrid
I just can't figure out how to set a column width on the fly.
Thanks!
--Brian Leach, [EMAIL PROTECTED] com
Never miss a thing. Make Yahoo your home page.
http://www.yahoo.com/r/hs
RE: [flexcoders] DataGrid column resizing
If horizontalScrollPolicy=off (default), the DG resizes columns to fit
the available space so you have less control over their size, and as you
change one column's size, the others respond. Temporarily setting
resizable=false often helps, but it might be better to reset the entire
column set at once with new columns with the right size. Make sure they
fit perfectly otherwise they'll get resized.
From: flexcoders@yahoogroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of brileach
Sent: Wednesday, January 16, 2008 12:51 PM
To: flexcoders@yahoogroups.com
Subject: [flexcoders] DataGrid column resizing
I've been slamming my head against my desk for the last day trying to
figure out how to resize DataGrid columns and I'm hoping somebody can
help me out. I'm using Flex 2.0.1. Any help will be much appreciated!
The idea here is that onCreationComplete the DataGridColumns will
recreate themselves based off of a certain size, eventually the length
of the data inside of them. I've gotten this to work with every
attribute except width. (labelFunctions, itemRenderers, etc.)
mx:Script
![CDATA[
private var gridData:Array = [
{ symbol: ADBE, name: Adobe Systems Inc., price: 49.95 },
{ symbol: MACR, name: Macromedia Inc., price: 39.95 },
{ symbol: MSFT, name: Microsoft Corp., price: 25.95 },
{ symbol: IBM, name: IBM Corp., price: 42.55 }
];
public function resizeGridColumns(gridId:Object):void {
var oldColumns:Array = gridId.columns;
var numberOfColumns:int = oldColumns.length;
var newColumns:Array = new Array();
for(var i:int = 0; i numberOfColumns; i++){
var oldColumn:DataGridColumn = (oldColumns[i] as DataGridColumn);
var newColumn:DataGridColumn = new DataGridColumn;
newColumn.dataField = oldColumn.dataField;
newColumn.headerText = oldColumn.headerText+-dynamic;
newColumn.width = 50;
newColumns.push(newColumn);
}
gridId.columns = newColumns;
}
]]
/mx:Script
mx:DataGrid id=grid
initialize=grid.dataProvider = gridData
creationComplete=resizeGridColumns(grid)
width=500
mx:columns
mx:DataGridColumn headerText=Name dataField=name /
mx:DataGridColumn headerText=Symbol dataField=symbol /
mx:DataGridColumn headerText=Price dataField=price /
/mx:columns
/mx:DataGrid
I just can't figure out how to set a column width on the fly.
Thanks!
--Brian Leach, [EMAIL PROTECTED] mailto:brileach%40yahoo.com
[flexcoders] DataGrid column resizing
Hi all,
I've been trying to make my DataGrid's resize appropriately when their
parent containers are resized but there is no joy to be had.
When you run the following demo code
mx:Application xmlns:mx=http://www.macromedia.com/2003/mxml;
load=myLoad()
mx:Script
import mx.core.Application;
public var app:Application;
function myLoad() {
app = Application(mx.core.Application.application);
}
/mx:Script
mx:DataGrid width=100%
mx:columns
mx:Array
mx:DataGridColumn headerText=25%
width={app.width * .25}/
mx:DataGridColumn headerText=50%
width={app.width * .50}/
mx:DataGridColumn headerText=25%
width={app.width * .25}/
/mx:Array
/mx:columns
/mx:DataGrid
/mx:Application
.. it initially draws in the correct proportion but if you resize the screen
you get all sorts of variations in column sizes.
Any ideas?
Thanks,
Paul.
~~---
This e-mail may contain confidential information. If you are not the intended
recipient, please notify the sender immediately and delete this e-mail from
your system. You must not disclose this e-mail to anyone without express
permission from the sender. The contents of all e-mails sent to and received
from Optus may be scanned, stored, or disclosed to others at Optus discretion.
Optus has exercised care to avoid errors in the information contained in this
e-mail but does not warrant that the information is error or omission free.
The information (including any pricing information) contained in this e-mail is
subject to change. This e-mail is not a quotation or proposal and no
contractual obligations arise until you and Optus sign a formal written
contract or formal variation to your existing contract.
Any pricing contained in this e-mail is exclusive of GST unless otherwise
stated.
Yahoo! Groups Links
* To visit your group on the web, go to:
http://groups.yahoo.com/group/flexcoders/
* To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
* Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
Re: [flexcoders] DataGrid column resizing
On 4/13/05, Paul Frantz [EMAIL PROTECTED] wrote:
mx:DataGrid width=100%
mx:columns
mx:Array
mx:DataGridColumn headerText=25%
width={app.width * .25}/
mx:DataGridColumn headerText=50%
width={app.width * .50}/
mx:DataGridColumn headerText=25%
width={app.width * .25}/
/mx:Array
/mx:columns
/mx:DataGrid
For some reason your DataGrid overrides the widths specified by you.
To get around this, set up a resize handler and reset the widths in
doLater():
function setColumnSizes():Void
{
datagrid.getColumnAt(0).width = app.width * 25 / 100;
datagrid.getColumnAt(1).width = app.width * 50 / 100;
datagrid.getColumnAt(2).width = app.width * 25 / 100;
}
mx:DataGrid width=100% id=datagrid
resize=doLater(setColumnSizes)
setColumnSizes() is called on the next frame after the DataGrid is resized.
--
[EMAIL PROTECTED]
http://manish.revise.org/
Yahoo! Groups Links
* To visit your group on the web, go to:
http://groups.yahoo.com/group/flexcoders/
* To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
* Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
RE: [flexcoders] DataGrid column resizing
To
solve my own issue (at least after testing so far)...
mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml"
xmlns:common="ibs.sm.ui.common.*"
mx:Script
function setColumnSizes():Void
{
datagrid.getColumnAt(0).__width = datagrid.width * 25 / 100;
datagrid.getColumnAt(1).__width = datagrid.width * 50 / 100;
datagrid.getColumnAt(2).__width = datagrid.width * 25 / 100;
datagrid.getColumnAt(0).resizable = false;
datagrid.getColumnAt(1).resizable = false;
datagrid.getColumnAt(2).resizable = false;
doLater(this, "resizableTrue");
}
function resizableTrue():Void {
datagrid.getColumnAt(0).resizable = true;
datagrid.getColumnAt(1).resizable = true;
datagrid.getColumnAt(2).resizable = true;
}
/mx:Script
common:SMDataGrid id="datagrid" width="100%" resize="setColumnSizes()"
common:columns
mx:Array
mx:DataGridColumn headerText="25%"/
mx:DataGridColumn headerText="50%"/
mx:DataGridColumn headerText="25%"/
/mx:Array
/common:columns
/common:SMDataGrid
/mx:Application
This is big hack but
seems to avoid the redraw nastiness. But of course its using 'undocumented
internals that may change
in future versions'
:-)
-Original
Message-From: Paul Frantz
[mailto:[EMAIL PROTECTED]Sent: Wednesday, 13 April 2005
12:02To: 'flexcoders@yahoogroups.com'Subject: RE:
[flexcoders] DataGrid column resizing
Thanks Manish. I had to change the resize attribute to
resize="doLater(app,
'setColumnSizes')"
for it to work and it you can see it wrestling with flex
for control of the widths when its drawing but its better than what I had
:)
Any other
ideas?
Cheers,
Paul
-Original Message-From: Manish Jethani
[mailto:[EMAIL PROTECTED]Sent: Wednesday, 13 April 2005
11:37To: flexcoders@yahoogroups.comSubject: Re:
[flexcoders] DataGrid column resizingOn 4/13/05,
Paul Frantz [EMAIL PROTECTED]
wrote:
mx:DataGrid
width="100%"
mx:columns
mx:Array
mx:DataGridColumn headerText="25%" width="{app.width *
.25}"/
mx:DataGridColumn headerText="50%" width="{app.width *
.50}"/
mx:DataGridColumn headerText="25%" width="{app.width *
.25}"/
/mx:Array
/mx:columns
/mx:DataGridFor some reason your DataGrid overrides the
widths specified by you. To get around this, set up a resize handler and
reset the widths
indoLater():
function
setColumnSizes():Void
{
datagrid.getColumnAt(0).width = app.width * 25 /
100;
datagrid.getColumnAt(1).width = app.width * 50 /
100;
datagrid.getColumnAt(2).width = app.width * 25 /
100;
} mx:DataGrid width="100%"
id="datagrid"
resize="doLater(setColumnSizes)"setColumnSizes() is called on
the next frame after the DataGrid is resized.--
[EMAIL PROTECTED]http://manish.revise.org/~~---This e-mail may contain confidential
information. If you are not the intended recipient, please notify the sender
immediately and delete this e-mail from your system. You must not disclose
this e-mail to anyone without express permission from the sender. The
contents of all e-mails sent to and received from Optus may be scanned,
stored, or disclosed to others at Optus discretion.Optus has
exercised care to avoid errors in the information contained in this e-mail
but does not warrant that the information is error or omission free. The
information (including any pricing information) contained in this e-mail is
subject to change. This e-mail is not a quotation or proposal and no
contractual obligations arise until you and Optus sign a formal written
contract or formal variation to your existing contract. Any pricing
contained in this e-mail is exclusive of GST unless otherwise
stated.
Yahoo! Groups Links
To visit your group on the web, go to:http://groups.yahoo.com/group/flexcoders/
To unsubscribe from this group, send an email to:[EMAIL PROTECTED]
Your use of Yahoo! Groups is subject to the Yahoo! Terms of Service.
RE: [flexcoders] DataGrid column resizing
Bugger. This should have been...
mx:Application
xmlns:mx="http://www.macromedia.com/2003/mxml"
mx:Script
function setColumnSizes():Void
{
datagrid.getColumnAt(0).__width = datagrid.width * 25 / 100;
datagrid.getColumnAt(1).__width = datagrid.width * 50 / 100;
datagrid.getColumnAt(2).__width = datagrid.width * 25 / 100;
datagrid.getColumnAt(0).resizable = false;
datagrid.getColumnAt(1).resizable = false;
datagrid.getColumnAt(2).resizable = false;
doLater(this, "resizableTrue");
}
function resizableTrue():Void {
datagrid.getColumnAt(0).resizable = true;
datagrid.getColumnAt(1).resizable = true;
datagrid.getColumnAt(2).resizable = true;
}
/mx:Script
mx:DataGrid id="datagrid" width="100%" resize="setColumnSizes()"
mx:columns
mx:Array
mx:DataGridColumn headerText="25%" width="{datagrid.width * .25}"/
mx:DataGridColumn headerText="50%" width="{datagrid.width * .25}"/
mx:DataGridColumn headerText="25%" width="{datagrid.width * .25}"/
/mx:Array
/mx:columns
/mx:DataGrid
/mx:Application
-Original Message-From: Paul Frantz
[mailto:[EMAIL PROTECTED]Sent: Wednesday, 13 April 2005
15:26To: 'flexcoders@yahoogroups.com'Subject: RE:
[flexcoders] DataGrid column resizing
To
solve my own issue (at least after testing so far)...
SNIP/
~~---
This e-mail may contain confidential information. If you are not the intended recipient, please notify the sender immediately and delete this e-mail from your system. You must not disclose this e-mail to anyone without express permission from the sender. The contents of all e-mails sent to and received from Optus may be scanned, stored, or disclosed to others at Optus discretion.
Optus has exercised care to avoid errors in the information contained in this e-mail but does not warrant that the information is error or omission free. The information (including any pricing information) contained in this e-mail is subject to change. This e-mail is not a quotation or proposal and no contractual obligations arise until you and Optus sign a formal written contract or formal variation to your existing contract.
Any pricing contained in this e-mail is exclusive of GST unless otherwise stated.
Yahoo! Groups Links
To visit your group on the web, go to:http://groups.yahoo.com/group/flexcoders/
To unsubscribe from this group, send an email to:[EMAIL PROTECTED]
Your use of Yahoo! Groups is subject to the Yahoo! Terms of Service.
