components-grid | Component CSS for grids | Grid library

The Vaadin Framework guide has a page describing how to use Column Renderers in a Vaadin Grid. And this page describes implementing renderers, but all too briefly.

I want to implement a InstantRenderer to complement the partial set of java.time renderers added in Vaadin 8.1. Renderers were added for LocalDate & LocalDateTime but not for Instant, OffsetDateTime, and ZonedDateTime. For my Instant renderer I am currently simply applying the current default time zone (ZoneId) to get a ZonedDateTime on which I call the toString method. More could be done, but this is just to get started.

So my code should be very similar to the provided LocalDateTimeRenderer. I am trying to follow that code as an guide.

In searching the Vaadin source code and reading the doc, it seems I need three pieces of source code:

• InstantRenderer ( similar to LocalDateTimeRenderer )
• InstantRendererConnector ( similar to LocalDateTimeRendererConnector )
• InstantRendererState ( similar to LocalDateTimeRendererState )

I have done this, and it all compiles. But my table fails to render, all I get is a white empty box on the page. No errors appear on the console or logs. If I remove my use of my InstantRenderer, and fall back to letting my Instant objects be rendered by the default of their own toString methods, all is well and the table appears as expected. So I know my custom renderer is at fault.

I am a newbie when it comes to "server-side" vs "client-side" Vaadin.

➠ Is there some kind of packaging I need to perform? Currently I have my three classes in my Vaadin project alongside the MyUI source file.

➠ Am I missing some other piece?

I instantiate my renderer by calling the no-arg constructor:

In Vaadin 8, sorting Grid rows is as simple as clicking the column header. This toggles the column between ascending and descending sorting as described here. This works when populating the Grid via grid.setItems() method.

However when using a DataProvider as the Grid data source, clicking the column header does not sort the rows.

There is documentation about sort orders described here with DataProviders but handles sort orders when there are multiple sorting requirements.

Is there an easy way to simply use the same default sorting behaviour that the Grid exhibits when populated with grid.setItems() for when we populate with grid.setDataProvider()?

I'm trying to adjust the height of the rows since I'm using components and the Vaadin Grid documentation says you can do this by calling setBodyRowHeight however that method no longer seems to be available...

UPDATE: I found the method setRowHeight() (the manual needs updating) however this also changes the column header row height which I don't want, I just want the rows to be taller (so the component fits) and not the header.

Im facing overlaps problem with my project when trying to resize browser. I was trying so many different variations to make it work, but still result is not acceptable.

Before resizing:

A, B and C are contained in VerticalLayout - I will call it root.

• Root is inside HorizontalLayout - content of UI.
• A is simple component.
• B is extending VerticalLayout that contains 2 HorizontalLayouts inside.
• C is only one component - Grid.

Now, when Im trying to resize my browser (like arrow shows) C is starting to steal other components place.

After resizing:

The effect I would like to achieve is that my Grid (C) is not trying to fit my browser. It should not move, and just hide - like below (green is showing actually visible part):

In Vaadin Framework 8.1 app, on the Grid widget, how does one clear a column renderer after setting it?

We can set a renderer on a Grid.Column by calling setRenderer. How to un-set it?

Passing null results in a null pointer exception:

java.lang.NullPointerException: Renderer can not be null

The default behavior before setting the renderer seems to be simply calling toString on the column’s objects.

➟ How get back to that default behavior?

Using the Table class of Vaadin one could add an action handler to a table. For example in previous Vaadin versions the following 2 options could be shown to the screen when a user right-click inside the table area:

I'm working on Vaadin, I'm trying to print data in a grid. I want to select this data. Previously I wanted to edit the data but it seems to be before the edit.[I took a look to : https://vaadin.com/docs/-/part/framework/components/components-grid.html#figure.components.grid.editing]

But when I have more then one row, it will always edit or select my first row.

See: Before any edit/select, it print the good values :

But when I try to edit/select the second row (just click on it), I have : That should be the user id :2, the first name :wc, the last name : sdsdf, ...

My code is :