vaadin 表格垂直直到但不超出页面底部，根据需要滚动条

Question

在我的 vaadin 7 应用程序中，我有一个包含 Tabsheet 的 CSSLayout。 Tabsheet 包含一个水平布局。 Horizo​​ntalLayout 包含一个表格。

该表有不同数量的列（3 到 20 列，可根据要求更改）。 我希望这张桌子水平和垂直占据所有可用空间。

但表格不应垂直延伸到屏幕之外。因此，如果行数超过它可以显示的表格应该有一个垂直滚动条。 （如果我在 table.setPageLength() 中设置行数就是这种情况，但是我想在不设置显式行号的情况下实现这一点，因为我希望表格占据所有可用空间而不管屏幕大小等...）

横向我也想要一个滚动条，如果有更多的列然后我们有空间。

如果我将所有内容（csslayout、tabsheet、horizo​​ntallayout、table）都保留为默认值，我会得到滚动条，但我会得到很多未使用的空间。

如果我在 tabsheet、horizo​​ntallayout、table 上使用 setSizeFull()，那么我就没有未使用的空间，但是我失去了水平滚动条，并且我永远无法使用垂直滚动条到达表格的末尾。

感谢任何帮助。

编辑 -- 更新 -- 编辑 -- 更新 -- 编辑 -- 更新 -- 编辑 -- 更新

这是一个示例代码。在我的屏幕上，不可能向下滚动到表格的最后一行。 （同样不可能使用水平滚动条）

@Override
protected void init(@SuppressWarnings("unused") VaadinRequest request) {


     CssLayout css = new CssLayout();

        HorizontalLayout upper = new HorizontalLayout();
        OptionGroup first = new OptionGroup();
        first.addItem("AAA");
        first.addItem("BBB");
        first.addItem("CCC");
        first.addItem("DDD");
        first.addItem("EEE");
        first.addItem("Whatever");
        upper.addComponent(first);
        css.addComponent(upper);


        HorizontalLayout hl = new HorizontalLayout();
        hl.setMargin(true);
        hl.setSpacing(true);
        IndexedContainer c = new IndexedContainer();

        for (int i = 0; i < 40; i++)
            c.addContainerProperty("name" + i, String.class, "name" + i);

        Table table = new Table("Test table", c);

        for (int i = 0; i < 100; i++) {
            Integer id = (Integer) c.addItem();
            c.getItem(id).getItemProperty("name0").setValue(String.valueOf(i));
        }

        hl.addComponent(table);
        TabSheet tab = new TabSheet();
        tab.addTab(hl, "Table");
        css.addComponent(tab);

        hl.setSizeFull();
        table.setSizeFull();
        tab.setSizeFull();
        css.setSizeFull();

      setContent(css);

}

Answer 1

也许你没有在 css 布局上设置完整的大小，或者样式有一些问题。

最好在为什么我的代码不起作用？之类的问题中发布一些代码。但是，我按照您的描述编写了一个简单的测试并按预期工作。

编辑

尝试使用VerticalLayout 而不是CssLayout

public class TestTableApp extends UI {

    @Override
    protected void init(VaadinRequest request) {
        VerticalLayout css = new VerticalLayout();

        HorizontalLayout upper = new HorizontalLayout();
        OptionGroup first = new OptionGroup();
        first.addItem("AAA");
        first.addItem("BBB");
        first.addItem("CCC");
        first.addItem("DDD");
        first.addItem("EEE");
        first.addItem("Whatever");
        upper.addComponent(first);
        css.addComponent(upper);


        HorizontalLayout hl = new HorizontalLayout();
        hl.setMargin(true);
        hl.setSpacing(true);
        IndexedContainer c = new IndexedContainer();

        for (int i = 0; i < 40; i++)
            c.addContainerProperty("name" + i, String.class, "name" + i);

        Table table = new Table("Test table", c);

        for (int i = 0; i < 100; i++) {
            Integer id = (Integer) c.addItem();
            c.getItem(id).getItemProperty("name0").setValue(String.valueOf(i));
        }

        hl.addComponent(table);
        TabSheet tab = new TabSheet();
        tab.addTab(hl, "Table");
        css.addComponent(tab);

        hl.setSizeFull();
        tab.setSizeFull();
        table.setSizeFull();
        css.setSizeFull();
        // this do the trick
        css.setExpandRatio(upper, 0);
        css.setExpandRatio(tab, 1);

        setContent(css);
    }
}