Change cursor on datagrid row

Question

I'm working on a flex project, and have a datagrid that I'd like the cursor to change when hovering over any row containing data.

I have double click enable on the datagrid and I'd like to indicate to the use that they can click the row they are hovering over.

This is what I've tried but it seems to just use the hand cursor on the datagrid its self and not the row data.

    <mx:DataGrid x="9" y="47" width="330" height="244" useHandCursor="true" buttonMode="true" mouseChildren="true" horizontalScrollPolicy="{ScrollPolicy.AUTO}" styleName="resultgrid" dataProvider="{acLatest}" doubleClickEnabled="true" itemDoubleClick="doubleClickoverview()"  id="overviewLatest_dg">
     <mx:columns>                   
        <mx:DataGridColumn headerText="Tag" id="overviewLatest_dg_animal_ptag" visible="true" dataField="animal_ptag" width="110" />
        <mx:DataGridColumn headerText="Status" id="overviewLatest_dg_status_status" visible="true" dataField="status_status" width="110"/>
        <mx:DataGridColumn headerText="Sex" id="overviewLatest_dg_animal_sex" visible="true" dataField="animal_sex" width="110"/>
     </mx:columns>
    </mx:DataGrid>

Answer 1

I would create an itemRenderer and add event listeners for the MouseEvent.ROLL_OVER and MouseEvent.ROLL_OUT events. In the event handlers you can change the cursor using the cursorManager . This also has the added benefit of allowing you to change the cursor based on some data or condition for the row the user is hovering their cursor over.

Here's an example on changing the cursor when mousing over a component. Hopefully this gets you started in the right direction.

Answer 2

Ended up using itemRollOver & itemRollOut on the datagrid.

Then just created a simple class that changes the cursor to a hand image.

DataGrid:

itemRollOver="Cursors.setHandCursor()" itemRollOut="CursorManager.removeAllCursors()"

Cursor Class:

package com {

  import mx.managers.CursorManager;
  import mx.managers.CursorManagerPriority;

  public class Cursors extends CursorManager {

    private static var handCursorList:Array = [];

    public static function setHandCursor():void {   
      [Embed(source="../images/hand.png")]   
      var handCursorClass:Class;
      handCursorList.push(setCursor(handCursorClass, CursorManagerPriority.MEDIUM));
    }  
  } 
}