I’ve just done a bunch of experimenting to place a table in another table. I struggled with getting the embedded table to “shrink” to naturally be the minimum height required to show all rows with no extra space underneath (the solution was to set the page length to 0 from the default of 15).
Now I have content (Labels) in the embedded table. One column has “notes” which can be a lot of text. The default behavior is to show it as one line and crop it when it reaches the end of the cell. I’d like to have the notes content wrap as it needs to to show all the content. If I set “white-space: normal” on the label, the notes content displays as desired but the embedded table appears to switch back to the default of 15 rows for page height, i.e., with 3 or 4 rows of content there’s a big white space underneath.
Is there any way to get free wrapping text to work in this way in a table? I’ve attached a screenshot of one row of the outer table showing the problem with the inner table height.
Basically, when it get’s down to it, Vaadin tables are designed for a simple grid, where every row has the same height, where there can be many 1000’s of rows which can be lazily loaded; the equivalent of a simple spreadsheet (or javax.swing.JTable) There are workarounds, but essentially, that’s what they are - workarounds.
From what I can see, your UI doesn’t seem to be that - and it looks to me like you’ll be working against the Vaadin table layout all of the way.
You can almost certainly do what you are trying to do here with a GridLayout - or even plain old HTML + a Vaadin Label : that’s what I’d suggest you do.
It does seem clear that Vaadin wants table row heights to be consistent, I think that’s the only thing I’m doing “against” Vaadin. Label HTML definitely won’t work, this is just an experiment, the final UI will have more complex content/controls in the cells. I tried GridLayout for something similar, but ran into problems where the content of a grid cell was cleared and replaced, the layout would fall out of alignment upon redraw.
