1

This is using the Vaadin starter project Hello World example. In essence I want to have the scrollbar in the VerticalLayout on the left rather than on the whole page as shown in the image below:

enter image description here

However no matter what I do the scrollbar always appears on the right side. I suspect this may have to do with the AppLayout but I'm not sure how to adjust it so that the scrollbar is on the VerticalLayout shown in the diagram below.

The code is as follows:

add(getHelloVerticalLayout(), new HorizontalLayout(new Button("Simple")));

Where getHelloVerticalLayout() consists of just a bunch of Hello buttons so that it's large enough to generate a scrollbar on the webpage.

private VerticalLayout getHelloVerticalLayout() {
    List<Button> buttons = new ArrayList<>();
    for(int x=0; x<=50; x++)
        buttons.add(new Button("Hello"));
    return new VerticalLayout(buttons.toArray(Button[]::new));
}
Stephane Grenier
  • 15,527
  • 38
  • 117
  • 192

1 Answers1

3

You can wrap your layout, which needs a scrollbar, with the Scroller component. See the official docs for more information and example https://vaadin.com/docs/latest/ds/components/scroller

Knoobie
  • 1,968
  • 10
  • 14
  • Yes, use the Scroller component. Adding scrollbars to layouts is not recommended, as it can mess up the layout/sizing of child components since the layout is a flex container. – Jouni Apr 12 '22 at 07:19