Grid problem when text are too long for a cell

Vaadin 6 / 7 / 8
1

Im a very annoying with de grid when some variable text exceed the cell width.

Here is a simple example :

We have a grid and the last column should have a variable width that would take all the table width minus the maximum width of other colums

 @Override
    protected void init(VaadinRequest vaadinRequest) {
        final VerticalLayout layout = new VerticalLayout();
        layout.setSizeFull();
        
        Grid grid = new Grid();
        grid.setSizeFull();
        
        grid.addColumn("Name").setWidth(200).setMaximumWidth(200).setExpandRatio(0);
        grid.addColumn("Start").setWidth(130).setMaximumWidth(130).setExpandRatio(0);
        grid.addColumn("End").setWidth(130).setMaximumWidth(130).setExpandRatio(0);

        //Take all the width left
        grid.addColumn("Description").setExpandRatio(1);
        
        grid.addRow("Test", "2017-05-31", "2017-06-30", "Text");
        grid.addRow("Test 2", "2017-06-30", "2017-07-31", "A very long text which should be cutted, but in my best wish will appear on multi lines but the grid can't have viarbale row height because of lazy loading i don't need");
        
        layout.addComponent(grid);
        setContent(layout);
    }

Works fine with small text…
but when we add a row with a long text then the column description has a width equal to the text size.
And then we have a horrible horizontal scrollbar.

(see atachment)

33121.png

2

You can style row height to be higher and define text wraping also with css.

You could also set your own style name with RowStyleGenerator and CellStyleGenerator for that specific column. The later one is handy for defining the text wrapping, since you probably do not want it enabled for the whole row.

Some earlier discussion is here

https://vaadin.com/forum/#!/thread/13828894/13828893

Here is some example about grid row height

https://vaadin.com/forum#!/thread/15297878/15302575

3

i try it but without success

setting a style with rowStyleGenerator and specify a height doesn’t work. the “tr” will have the desired height, but the grid will stil display the generic height of the grid.

So i can’t specify a row height for one specific row.I can only set a row height bigger for all rows on my grid

And if i do that, in my TreeGrid, all rows will have the same height. And for nodes it’s ugly.

4

So i can’t specify a row height for one specific row.I can only set a row height bigger for all rows on my grid

This is design limitation in the Grid, it does not currently support variable row heights.