You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Vaadin 8.24.0 (also tested with 8.14.3)
Latest Windows 11 Chrome (also tested with Debian Buster & Chromium)
Simple Maven project with archetype vaadin-archetype-application
jetty.plugin.version 9.4.53.v20231009
In my test I have a grid with two component rendering columns. Components are HorizontalLayouts with full size, containing two HorizontalLayouts with one aligned to the left and one aligned to the right. I have set the expand ratio for the left one to 1.
In my test when I start scrolling down on the grid suddenly the layout on the right starts to be aligned badly:
Please see below the source code of my test grid.
public class MyGrid extends Grid<Integer> {
public MyGrid() {
this.createColumn("column 1", 250);
this.createColumn("column 2", 250);
this.setWidth(520, Unit.PIXELS);
List<Integer> items = new ArrayList<Integer>();
for (int i = 0; i < 400; i ++) {
items.add(i);
}
this.setItems(items);
}
private void createColumn(String caption, int width) {
this.addColumn(i -> {
HorizontalLayout leftLayout = new HorizontalLayout();
leftLayout.setMargin(false);
leftLayout.setSpacing(true);
leftLayout.addComponents(new Label("label 1"), new Label("label 2"));
HorizontalLayout rightLayout = new HorizontalLayout();
rightLayout.setMargin(false);
rightLayout.setSpacing(true);
rightLayout.addComponents(new Label("label 3"));
HorizontalLayout layout = new HorizontalLayout();
layout.setMargin(false);
layout.setSpacing(true);
layout.setSizeFull();
layout.addComponents(leftLayout, rightLayout);
layout.setComponentAlignment(leftLayout, Alignment.MIDDLE_LEFT);
layout.setComponentAlignment(rightLayout, Alignment.MIDDLE_RIGHT);
layout.setExpandRatio(leftLayout, 1);
return layout;
}, new ComponentRenderer())
.setWidth(width)
.setCaption(caption);
}
}
The text was updated successfully, but these errors were encountered:
@thevaadinman Tested with 8.25-SNAPSHOT and the same test that failed with 8.24.0 passes with 8.25-SNAPSHOT. Rendering takes a bit of time when scrolling down (I assume Javascript is doing some heavy work) but after a small wait everything is rendered as expected. Thank you!
@mikke-alekstra yeah, this is an unfortunate compromise for now. The fix is based on @TatuLund's implementation that hooks into Escalator's scroll event in GridConnector and schedules a re-layout. This induces some overhead, unfortunately; a more proper fix with less overhead would be to remove the scroll listener and instead schedule a partial re-layout for recycled rows during scrolling, either in Grid or in Escalator itself, depending on the architecutre. However, given the complexity of those components, we've opted for fastest deliverable for right now, as this bit of the code was very easy to hook into, while the internals of Grid and especially Escalator are pretty much the polar opposite; we'll re-visit this in the future if the performance hit proves excessive.
Vaadin 8.24.0 (also tested with 8.14.3)
Latest Windows 11 Chrome (also tested with Debian Buster & Chromium)
Simple Maven project with archetype vaadin-archetype-application
jetty.plugin.version 9.4.53.v20231009
In my test I have a grid with two component rendering columns. Components are HorizontalLayouts with full size, containing two HorizontalLayouts with one aligned to the left and one aligned to the right. I have set the expand ratio for the left one to 1.
In my test when I start scrolling down on the grid suddenly the layout on the right starts to be aligned badly:
Please see below the source code of my test grid.
The text was updated successfully, but these errors were encountered: