Как добавить полосу прокрутки в макет Vaadin

Я нашел много вопросов, когда люди спрашивают, как скрыть полосы прокрутки в макетах Ваадина, но моя проблема в том, что Ваадин не показывает мне никаких полос прокрутки. Например, у меня может быть этот код:

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());
}

Но когда я запускаю этот код, кнопки на странице просто обрезаются, когда окно браузера слишком мало, чтобы показать их все. Никаких полос прокрутки никогда не появится.

Я также попытался создать Panel, а затем добавлю свой макет на эту панель. Я тестировал оба - panel.addComponent(foo), а также panel.setContent(foo), и я также попытался установить panel.setScrollable(true). Без успеха.

Есть ли способ добавить панель прокрутки к какому-то макету Vaadin? Я использую Ваадин 6.8.7. Спасибо заранее!

Есть мой полный код:

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;
}

Этот метод используется в классе, который расширяет Окно, и поэтому во время инициализации есть: setContent(openZoomifyLayout());

Ответы

Ответ 1

Ваш sp HorizontalLayout и ваш photos Panel должен быть в полном размере.

Как вы можете прочитать в главе книги Ваадина 6.6.1

Обычно, если панель имеет размер undefined в направлении, как это имеет место по умолчанию по вертикали, он будет соответствовать размеру контента и расти как содержание растет. Однако, если он имеет фиксированный или процентный размер и его содержимое становится слишком большим, чтобы вписаться в область содержимого, полосу прокрутки появится для конкретного направления. Полосы прокрутки на панели обработанный браузером с переполнением: свойство auto в CSS.

Ответ 2

Вам понадобится панель. Вам также необходимо убедиться, что размер панели фиксирован, а не "естественный". Если его размер "естественный", панель будет увеличена до полного отображения содержимого. Размер по умолчанию для панелей является естественным, и именно по этой причине вы не видите никаких полос прокрутки.

Ответ 3

Выполните следующие действия:

  • внешняя компоновка требует фиксированного или процентного размера в соответствующем направлении (например, VerticalLayout требуется фиксированная или процентная высота)
  • внутренний макет требует размера undefined в этом направлении
  • для внешнего макета требуется stylename v-scrollable

например.

public class SomeView extends CustomComponent implements View
{
        this.addStyleName("v-scrollable");
        this.setHeight("100%");
        VerticalLayout content = new VerticalLayout();
        // content has undefined height by default - just don't set one
        setCompositionRoot(content);
...
}

Это заставит CustomComponent показывать полосу прокрутки, когда content растет по мере необходимости.