As a very general word of warning, I'd advise you to be more careful and expect more pain when working with the following classes (and all associated base classes, etc): AdvancedDataGrid, OLAPDataGrid, GroupingCollection.

I'll try to be extremely politically correct here, but I assume you'll catch my drift... These classes were written by a different part of the Flex team, in a different part of the world, and they are quite different than the standard Flex framework code base. They often don't follow the same coding standards, and in my opinion they are not up to the same quality level that I have come to expect from the Flex framework. I'll stop at that before I make too many Adobeans mad at me, but just know that I've learned to expect a whole new kind of pain when working with those classes.

My customer was not interested in excuses; he wanted me to produce working item and edit renderers for an AdvancedDataGrid, and soon. After some experimentation, I discovered an elegant solution that I would like to share with you, gentle reader.

One way that AdvancedDataGridColumn differs from DataGridColumn is that the default itemEditor will not activate if an itemRenderer is specified. The default values for the relevant AdvancedDataGridColumn properties do work, and I relied on that when figuring out how to make custom renderers work:

• dataField="data"


• rendererIsEditor="false"


• itemEditor="mx.controls.TextInput"


• itemRenderer="mx.controls.Label"

As you can see, the itemRenderer and editRenderer need not extend AdvancedDataGridItemRenderer; they may extend any UIComponent subclass.

In ActionScript, specify the AdvancedDataGridColumn renderers like this:

var column:AdvancedDataGridColumn = new AdvancedDataGridColumn();

column.dataField = "whatever";

column.headerText = "blah blah";

column.editable = true;

column.itemEditor = new ClassFactory(TextInput);

column.itemRenderer = new ClassFactory(CustomAdvancedDataGridItemRenderer);

The AdvancedDataGridColumn.rendererIsEditor property should only be set true when the same class is used for both types of renderers. As you can see, the default renderer classes are different from each other.

The secret to getting AdvancedDataGrid to behave when you want to spacify one of the renderers is to specify both of them. To illustrate this, I put together a short demo application that features an AdvancedDataGrid with two columns. The right-hand column uses the default itemEditor and itemRenderer classes (TextInput and Label). The left-hand column uses a custom AdvancedDataGridItemRenderer for the itemRenderer, and a TextInput for the itemEditor.

Going one step further, I wanted to change the default selection / edit mouse behavior. By default, when edit mode is enabled, DataGrid and AdvancedDataGrid both immediately enter edit mode with a single click. Instead, I wanted a single click to select a row, and a double-click to edit a cell. After providing a double-click event handler, I discovered that the double-click interval that Adobe provides was unusable. To solve this problem, I used flash.utils.Timer to implement my own double-click detection logic with only five lines of code. Because I did not use the default Flex double-click handler, I did not specify doubleClickEnabled="true".

Here is a demo web application that illustrates how this all works, with view source enabled. Check it out!

_______________________________

Mike Slinn
Independent full-service software contractor and author
http://slinnbooks.com
http://mslinn.com