return undefined;

CellularDataGrid for Flex 2

Posted in AS3, Flex by Ben Clinkinbeard on the November 9th, 2007

A DataGrid that supports highlighting and selection on a cellular level (as opposed to row level like the default) is a fairly common request/topic. While I realize people have done this before and this is supported out of the box by Flex 3 (sort of, see first comment below) I decided to give it a shot during some down time yesterday. I was pretty amazed at how easy it was. Even in my newline-happy code format the component is only 55 lines. The results of about 2 hours of fiddling can been seen and downloaded by following the link below.

View CellularDataGrid (Right click for source)

Hopefully someone finds this useful and/or interesting. If nothing else it should serve as an example of why diving into the framework and getting your tweak on is a worthwhile activity.

Update: Thanks to Tom’s suggestion, the problem with the selection indicator not disappearing correctly when selecting a cell in the same row is now fixed. The example and source have been updated.

10 Responses to 'CellularDataGrid for Flex 2'

Subscribe to comments with RSS or TrackBack to 'CellularDataGrid for Flex 2'.

  1. Tom Chiverton said,

    on November 9th, 2007 at 11:49 am

    “out of the box” only if you buy Flex 3 with DataVisualisation.

  2. Ben said,

    on November 9th, 2007 at 11:53 am

    Ah, thanks for that heads up Tom. I haven’t made the jump yet and wasn’t sure.

  3. Rob McKeown said,

    on November 9th, 2007 at 12:35 pm

    very cool. One think I noticed though is if you select a cell in the same row as the currently selected cell, the previously selected one’s highlight doesn’t get removed until you move the mouse off that row.

  4. Ben said,

    on November 9th, 2007 at 3:45 pm

    Hi Rob, I did notice that and spent a few minutes trying to fix it but had no luck.

  5. Tom Chiverton said,

    on November 22nd, 2007 at 10:40 am

    The fix for the highlight moving appears to be
    for each (var sp:Sprite in selectionIndicators ){
    sp.graphics.clear();
    }
    as the first thing in selectItem()

  6. Ben said,

    on November 22nd, 2007 at 12:35 pm

    Thanks Tom! I will try to get that implemented when I get a chance and update the post.

  7. Thu Vu said,

    on February 5th, 2008 at 10:08 am

    This has been very useful for what I am trying to do with my project. One thing I noticed is that when you select a cell and start to scroll up/down, the selected cell is now another cell randomly. It seems like this is the issue with cell rendering being recycled? Any suggestions? Thanks.

  8. Ben said,

    on February 5th, 2008 at 10:24 am

    Hi Thu,

    I do see the behavior you mentioned, thanks for catching that. Unfortunately I am swamped right now and don’t really have time to investigate. If I can find some time and fix it I will be sure to let you know.

    Thanks,
    Ben

  9. SimpleSoul said,

    on February 20th, 2008 at 1:38 pm

    Hi

    Fantastic. Does anyone know how to do this in Flash as3?
    As far as I can see it’s only possible to return the row selected not individual cells.

    This would solve a big head ache for me.

    Thanks
    SimpleSoul

  10. Lucas Gerken said,

    on March 26th, 2008 at 2:55 pm

    Hi

    Your code doens´t work when the propriety of the datagrid
    “lockedcolumncount” is > than 0

    Thanks
    Lucas Gerken

Leave a Reply