Vaadin HybridMenu转变与scrollpanel(Vaadin HybridMenu

2019-10-28 12:27发布

我想滚动条添加到我的web应用程序,所以我可以看到我的每一个浏览器组件。 在下面的图片红色矩形网格 。 网格置于内部扩展类VerticalLayout的和实现视图 。

绿色显示我的滚动条被添加到HybridMenu实例。

    HybridMenu root = HybridMenuBuilder.get()
            .setContent(new VerticalLayout())
            .setMenuComponent(EMenuComponents.LEFT_WITH_TOP)
            .setConfig(menuConfig)
            .build();

    root.addStyleName("scrollpanel");
    root.setSizeFull();
    super.setContent(root); //class extends UI

scrollpanel定义的CSS:

.scrollpanel > div {
        overflow: auto !important;
    }

当我减少浏览器窗口的高度,菜单栏也被滚动:

我试图滚动条设置为VerticalLayout的,但它似乎是ID没有捕捉到电网被部分隐藏。 (我已经设置好的一切VerticalLayout的,以全尺寸- 如何滚动条添加到Vaadin布局 )

//extends VerticalLayout implements View
private void init()
{
    this.addStyleName("scrollpanel");
    this.setSizeFull();
    this.setMargin(false);

    grid.setSizeFull();
    this.addComponentsAndExpand(grid);
    this.setExpandRatio(grid, 0.7f);
    this.setComponentAlignment(grid, Alignment.TOP_LEFT);
}

一般来说,我发现在VerticalLayout的组件的一些不预期(至少对我来说)的行为。 它们根据布局根(动作不同与VerticalLayout的如根实施例 )。

问题:

  • 如何滚动,当我躲在避免混合菜单的一部分?
  • 我缺少的东西有关添加滚动面板这个VerticalLayout的?

@编辑:

我发现, 这个如果不出现问题HybridMenu内容不fullSized或内容未设置。 在另一方面滚动条不可无它。

因此,创建HybridMenu下方显示,代码的方式,解决了scrollpanels问题,而是恢复以前的问题 (布局类型不会改变任何东西)。

    AbsoluteLayout test = new AbsoluteLayout();
    test.setSizeFull();
    HybridMenu root = HybridMenuBuilder.get()
                .setContent(test)
                .setMenuComponent(EMenuComponents.LEFT_WITH_TOP)
                .setConfig(menuConfig)
                .build();
文章来源: Vaadin HybridMenu shift with scrollpanel