Row resizing?

[rkaneriya]

Hi Günter,

I've been keeping up with your work on the Datagrid for a few weeks now and it's looking great!

Just wondering: is it possible for you to implement row resizing in the grid by dragging the border between rows, similar to the way in which columns can be resized? This would be a nice, convenient feature to have. Any chance it could be added?

Thanks for your efforts, and keep up the great work!

Cheers, Rishi

[zoechi]

Hi Rishi,

thanks a lot for your interest in BWU Datagrid!

Do you want to resize single rows or should all rows resize equally?

I think this is nothing that can easily be done. The grid is optimized for speed with big data sets and this depends a lot that it's easy to calculate which rows to show when moving the scrollbar. Differently sized rows would make this very hard. Resizing all rows equally could work but I have to check. There is still a lot of work to do to improve the available features, therefor it will take a while until I find time to look into this.

Cheers Günter

[rkaneriya]

Thanks for your prompt reply! Re-sizing all rows equally was my primary interest; I can see why re-sizing single rows would be so difficult. Currently, I see that updating the "rowHeight" property in the grid options would re-size all the rows equally, but I am having trouble allowing for easy UI control of this value (preferably, by dragging the border between rows, similar to column re-sizing).

Time permitting, please do let me know if equal row-resizing with the grid UI is possible, or point me in the right direction. I understand your prioritizing concerns and thank you again for all your work on the grid!

Best, Rishi

[zoechi]

Sorry for the delayed response, I have troubles keeping up with incoming mail.

I guess it is possible, probably very similar to column resizing.

What you need are handles that you can drag. This could be done similar to the drag handles in this example where a column is dedicated for dragging. A custom formatter allows to add the necessary custom HTML.

The grid fires drag'n drop events, you just have to check if your handles are dragged and declare that you take responsibility for this drag action. Then changing the row height according to the drag actions and re-render the grid should be enough.

The grid currently uses two different kinds of drag'n drop implementations.
Column resize uses a custom drag'n drop implementation with custom event handling. The row reordering and row deletion in the 09 example uses HTML5 drag'n drop with some hacks to support custom drag images. Currently both work fine, but I have yet to test in the other browsers to see which one to prefer.

You should be able to implement this functionality just by configuration and adding event handlers without changing Datagrid code. I'm just porting SlickGrid JavaScript code to Dart and therefore don't know every detail myself yet, so take the advice with a grain of salt.

[rkaneriya]

Thank you for the response! This is very helpful. Once again, great work on the grid!