bvaughn / react-window

React components for efficiently rendering large lists and tabular data
https://react-window.now.sh/
MIT License
15.51k stars 778 forks source link

Question about column span #425

Open adrienpwd opened 4 years ago

adrienpwd commented 4 years ago

Hi Brian and everyone else,   First of all, thank you so much for all the work you put in this project !

I would like to achieve "column span" with react-window. For now the only way I found was to play with the borders. It looks fine, but if my header name is too long to fit, it will be cropped because it can only fit in the 1st column of the "spanned cells". In the example below we can see the word "Schedule" is cropped at the end.

Screen Shot 2020-02-19 at 2 00 11 PM

Is there a way to do that at the moment ? If not, is it in your roadmap for react-window ? Does anyone have an idea of how I could implement that ?

Thank you !

bvaughn commented 4 years ago

Is there a way to do that at the moment ? If not, is it in your roadmap for react-window ?

No and no.

Does anyone have an idea of how I could implement that ?

I'd suggest asking on Stack Overflow :)

You might also read through #60

MarkFalconbridge commented 4 years ago

We have a similar design and have achieved the result using a grid and a horizontal list and synchronising their scrolling. The horizontal list is rendered immediately above the grid and provides the column headers for the grid.

adrienpwd commented 4 years ago

@MarkFalconbridge Thank you for replying ! At the moment I have almost the same setup, but my Headers are rendered in a Grid. The difficulty I'm facing is my Headers have a width that changes depending on the number of "children" they have. Do you have this too ? If yes, do you calculate the width for the cell width on rendering, or you parse your data upfront ? Thank you !

MarkFalconbridge commented 4 years ago

@adrienpwd Yes, we have the same set up, the headers width changes depending on how many children they have. In our case the child cells have a fixed width and I know how many belong to each column header so I can calculate the width of the header up front.