Flex: select the row and column of the DataGrid.

 

By default, when a cell in the DataGrid is selected, the row (item) of the cell is selected. How can I select the column where the cell is located at the same time? This article will answer this question raised by netizens.

Download the source code of this instance:/files/fooo/crossselect.zip

It is not hard to see that we achieve this through the custom project Renderer (itemrenderer. First, set the userollover style of the DataGrid to false to cancel the default mouse behavior. Then we added a custom mouse event to the project Renderer. The mouse_over and mouse_out events only change the background color of the cell when you move the cursor to or remove the cell. The isitemselected method ensures that only the unselected project Renderer can move the mouse. Mouse_down allows you to select the row and column of a cell. It is implemented by traversing the columnindex attribute.CodeIt is very simple, but note: When drawing the text background associated with items in the grid for the project Renderer, you must set background = true to specify that the text field has background filling.

Of course, you can also use the DataGrid event to implement similar functions.

//--------------------

The event listening is loaded in the as file:

Public Function backgroundcolorrenderer ()
{
Super ();
This. addeventlistener (mouseevent. mouse_over, overhandler );
This. addeventlistener (mouseevent. mouse_down, downhandler );
This. addeventlistener (mouseevent. mouse_out, outhandler );
}

 

If you only need to hover the mouse over the color, you can make the following adjustments to copy the code of the click event to the Mouseover event. For example:

 

Private function overhandler (Event: mouseevent): void
{
// Var DG: DataGrid = DataGrid (listdata. Owner );
// If (! DG. isitemselected (data ))
//{
// This. Background = true;
// This. backgroundcolor = DG. getstyle ("rolovercolor ");
//}

This. Background = false;
VaR DG: DataGrid = DataGrid (listdata. Owner );
VaR color: uint = DG. getstyle ("selectioncolor ");

For (var I: Int = 0; I < DG. Columns. Length ; I ++)
{
VaR column: datagridcolumn = DG. Columns [I] As datagridcolumn;
If (I = Listdata. columnindex)
{
Column. setstyle ("backgroundcolor", color );
}
Else
{
Column. clearstyle ("backgroundcolor ");
}
}
}