Firzen Firzen - 6 months ago 22
Java Question

How to add scrollbar to Vaadin layout

I have found many questions where people are asking how to hide scrollbars in Vaadin layouts, but my problem is that Vaadin don't show me any scrollbars.
For example I can have this code:

HorizontalLayout layout = new HorizontalLayout();
layout.setSizeUndefined(); // I also tried setSizeFull()
for(Integer i = 1; i <= 15; i++) {
layout.addComponent(new Button("Test button #" + i.toString());
}


But when I run this code, buttons on the page are simply cut off when the browser window is too small to show them all. No scrollbars will appear ever.

I have also tried to create Panel, and then add my layout to this panel. I have tested both -
panel.addComponent(foo)
and also
panel.setContent(foo)
, and I tried to set
panel.setScrollable(true)
too. Without any success.

Is there any way to add scrollbar to some kind of Vaadin layout? I use Vaadin 6.8.7.
Thanks in advance!




There is my full code:

private ComponentContainer openZoomifyLayout() {
Panel panel = new Panel();
Panel panel2 = new Panel();

middlePanel = new MiddlePanel();

VerticalLayout mw = new VerticalLayout();
mw.setSizeFull();

HorizontalLayout sp = new HorizontalLayout();
Panel photos = new Panel();
photos.setSizeUndefined();

mw.addComponent(panel);
mw.addComponent(panel2);
mw.addComponent(sp);

mw.setExpandRatio(sp, 99);
mw.setExpandRatio(panel, 0);
mw.setExpandRatio(panel2, 0);

panel2.addComponent(middlePanel);

mw.setComponentAlignment(panel, Alignment.TOP_CENTER);
mw.setComponentAlignment(panel2, Alignment.TOP_CENTER);

photos.setContent(table);
photos.setScrollable(true);
sp.addComponent(photos);
sp.addComponent(createMainDetail());

return mw;
}


This method is used in class which extends Window, and so in time of initialization is there:
setContent(openZoomifyLayout());

Answer

Your sp HorizontalLayout and your photos Panel need to be full sized.

As you can read in the Vaadin Book chapter 6.6.1

Normally, if a panel has undefined size in a direction, as it has by default vertically, it will fit the size of the content and grow as the content grows. However, if it has a fixed or percentual size and its content becomes too big to fit in the content area, a scroll bar will appear for the particular direction. Scroll bars in a Panel are handled natively by the browser with the overflow: auto property in CSS.