4

Vaadin version: 8.1.4

My problem is that after resizing the screen the grid is not resized properly. I use setSizeFull() for a grid. After resizing the browser grid, however, retains its original size.

The next code sample seems to do the trick, but I wonder if there is a better method.

        UI.getCurrent().getPage().addBrowserWindowResizeListener(e -> {
           grid.recalculateColumnWidths();
        });

P.S. I forgot to mention, the problem with current solution is that in case of very long texts for fields vaadin tries to adjust the grid so that all the text will fit, which results in grid having more than 100% of width.

Example:

Grid<MyObject> = new Grid(); 
grid.addColumn(MyObject::getDescription).setCaption("Caption").setSortable(false);

Css styling for grid cell:

.v-grid-cell {
    white-space: nowrap;
    overflow: hidden;
}

Without recalculating column widths the grid fits nicely into the page no matter what is the size of the MyObject description, but after the recalculation(in case the MyObject descrtiption does not fit into the browser window) the grid is wider than the window.

  • I was struggling the same problem and this solution is probably the simplest and the clearest one. If it fits all your needs I would suggest leaving it as it is – Dawid Fieluba Dec 28 '17 at 10:45
  • Hi avix, the method works but I forgot to mention one important detail - vaadin can not handle 100% width in case of large texts with this method. Strangely, but proper 100% width works at the first opening of the page, probably because of overflow:hidden, which is later overriden by vaadin's JS. – Oleksandr Husiev Dec 28 '17 at 15:39
  • What is you exact Vaadin version? Can you add simple example case where the resize fails? – pirho Dec 29 '17 at 08:20
  • Hi pirho, I've added the example and vaadin version to the initial question – Oleksandr Husiev Dec 29 '17 at 10:18

0 Answers0