Disable scrolling in VerticalSplitPanel

Vaadin 6 / 7 / 8
1

Hi everyone,

let’s say I have the following simple application:

[code]
@Theme(“mytheme”)
public class MyUI extends UI {

@Override
protected void init(VaadinRequest vaadinRequest) {
    VerticalSplitPanel panel = new VerticalSplitPanel();
    panel.setHeight(100, Unit.PIXELS);

    VerticalLayout vlayoutFirst = new VerticalLayout();
    vlayoutFirst.setHeight(500, Unit.PIXELS);

    VerticalLayout vlayoutSecond = new VerticalLayout();
    vlayoutSecond.setHeight(500, Unit.PIXELS);

    panel.setFirstComponent(vlayoutFirst);
    panel.setSecondComponent(vlayoutSecond);

    setContent(panel);
}

@WebServlet(urlPatterns = "/*", name = "MyUIServlet", asyncSupported = true)
@VaadinServletConfiguration(ui = MyUI.class, productionMode = false)
public static class MyUIServlet extends VaadinServlet {
}

}
[/code]I am using a VerticalSplitPanel and set VerticalLayouts as first and second components. The VerticalSplitPanel has a fixed height of 100 pixels. Both VerticalLayouts have a fixed height of 500 pixels, which means, that you will see a scrollbar in the first and second part of the VerticalSplitPanel.

Now my question is: Is it possible to hide this scrollbar (disable scrolling) for only the first part of the VerticalSplitPanel but leave it like it is for the second part?

2

Just adding some information to make my intention clear. :slight_smile:

The following HTML gets generated with the above code:

[code]

...
...
3

Ok, so I found a solution for this.

You can hide the scrollbar for the first container by simply setting this in your CSS:

.v-splitpanel-first-container { overflow: hidden; } Of course you have to make sure, only to use this for VerticalSplitPanels where you need it.