by Alex Harui

 Comments (14)

Created

March 12, 2011

The Spark DataGrid is almost ready to ship. We ran out of time to do some of the things MX DataGrid could do, including popular things like drag and drop of columns to change the order of the columns, and drag and drop of items to copy or move items to and from other DataGrids and Lists or within the same DataGrid.

I found some time to show how to add that to the DataGrid. I was able to do it without subclassing, which indicates that we got the public APIs right, but if you want to have multiple DataGrids in your app, I would fold the drag/drop code into a subclass anyway. In the demo, there is an empty list below the DataGrid you can drag to or drop from.

If you’re wondering why we couldn’t bake this into DataGrid even though I had time to code it up on my blog, it is because of the time required to test and debug and handle drag/drop of cell selection. It is a prototype, not finished code. But I’ll bet we’ll integrate code like this into a future release.

I also created the Spark version of the CheckBox in MX DataGrid post. I like this implementation of using CheckBoxes in DataGrid when the dataProvider doesn’t have a slot to store the selected state. You can use the selectedIndices or selectedItems to access which items are checked without having to loop through your dataProvider. In creating this post, I also created the Spark version of the tri-state CheckBox (a CheckBox with a partially filled check box that indicates that not all items are selected in the DataGrid. It was pretty easy to do because the skin parts are easily accessible and it is easy to add a new state to the CheckBox.

Usual caveats apply: not officially supported, may not fix bugs, etc.

Run Demo
Download Source

COMMENTS

  • By Marcelo de Assis - 5:32 PM on March 14, 2011   Reply

    Hi Alex,

    I just found a bug: Try dragging Gordon, for exemple, to the bottom box. Then, select all itens using the top checkbox, and drag the FirstName label to below any item.

  • By Dmitry - 11:21 AM on March 15, 2011   Reply

    Hi!

    What’s release date of spark datagrid?

    • By Alex Harui - 8:38 PM on March 18, 2011   Reply

      Soon.

  • By Alex - 5:17 PM on March 24, 2011   Reply

    Hi Alex, great examples with Spark Datagrid. Do you know any solution to draw row background depending of the data. Drawing the background in each renderer of the row makes bad perfomance. Thanks

    • By Alex Harui - 6:21 AM on April 18, 2011   Reply

      I would imagine you can draw anything you want into the layers in the Spark Grid component.

  • By bobi - 10:29 PM on March 28, 2011   Reply

    ok, that was 10 days ago.
    Any news ?
    how to get the new framework ?
    regards

    • By Alex Harui - 6:22 AM on April 18, 2011   Reply

      Prelease.adobe.com. But it should be officially available very soon.

  • By Vander - 9:41 PM on April 9, 2011   Reply

    Hi Alex, it´s me…
    hehe
    i´ve got how to do checkbox in grid, without having to stuck on selected… i´ve just did another kind of trick… :)

  • By wren - 3:20 PM on September 19, 2011   Reply

    spark datagrid in 4.5.1 ahipped without drag and drop.. any idea when we will actually see it?

    • By Alex Harui - 4:57 AM on October 28, 2011   Reply

      I’ve seen the prototypes so it is in the works.

  • By kaissun - 10:44 AM on December 22, 2011   Reply

    draggableColumns property does not exist in the spark DataGrid.
    Could you give the equivalent functionality please ?

    Thanks in advance.

    • By Alex Harui - 6:45 AM on January 3, 2012   Reply

      Column dragging is on by default. I guess you could subclass GridColumnHeaderGroup to disable it

  • By sabka - 7:42 PM on January 1, 2012   Reply

    this slows down with large datasets? any solution to this?

    • By Alex Harui - 6:50 AM on January 3, 2012   Reply

      I haven’t tried it myself, but I saw there is a call to getItemIndex that might be slowing things down. If you can find another way to compute the dropIndex it might speed things up.

ADD A COMMENT