Layout 在垂直布局中填充可用空间

Layout 在垂直布局中填充可用空间,layout,vaadin,vaadin7,Layout,Vaadin,Vaadin7,在我的vaadin项目中,我有一个垂直布局(高度为100%),其中还有两个垂直布局。第一个具有固定的高度,而第二个应填充浏览器窗口的剩余空间。它将具有比剩余空间更大的高度,并且具有overflow-y:scroll css属性。我尝试了setExpandRatio方法,但没有成功(高度通常超过剩余空间)。我可以用vaadin实现这一点,还是必须使用javascript实现这一点 AbstractOrderedLayout root = new VerticalLayout(); root.set

在我的vaadin项目中,我有一个垂直布局(高度为100%),其中还有两个垂直布局。第一个具有固定的高度,而第二个应填充浏览器窗口的剩余空间。它将具有比剩余空间更大的高度,并且具有overflow-y:scroll css属性。我尝试了setExpandRatio方法,但没有成功(高度通常超过剩余空间)。我可以用vaadin实现这一点,还是必须使用javascript实现这一点

AbstractOrderedLayout root = new VerticalLayout();
root.setHeight(100, Unit.PERCENTAGE);
AbstractOrderedLayout child1 = new VerticalLayout();   
AbstractOrderedLayout child2 = new VerticalLayout();  

child1.setHeight(200, Unit.PIXELS);
root.addComponent(child1);

child2.setHeightUndefined(); 
root.addComponent(child2); // child2 will be filled with items. if its higher than the remaining space, it should be scrollable (overflow-y: auto)
// root.setExpandRatio(child2, 1F);

所以,如果我理解正确的话,你们希望有一个固定高度的第一个区域和一个可能大于剩余高度的第二个区域,所以它需要滚动

如果是这样的话,这里是布局

  • 垂直布局“主”(尺寸L)

    • 垂直布局“1”(宽度100%,高度固定):用固定高度内容填充此布局
    • 面板(尺寸为L+垂直布局上的设置扩展为1)
      • 垂直布局“2”(宽度100%,高度未定义):用其他内容填充此布局

关于

“不起作用”可以是任何意思。想详细说明一下吗?为了保持正常的滚动行为,我宁愿使用“面板”(100%高度和1扩展比),并将布局放在其中。当我向第二个子对象添加内容时,它会比剩余空间长。它没有像我预期的那样被剪切,也没有出现滚动条。整个项目比较复杂,我需要垂直布局。我只是删除了所有不必要的东西,来描述我的问题。然后同样适用于。使用面板。代码更改大约有四行。只需将上面示例中的child2放入一个面板,并将面板而不是child2添加到根目录中。我真的无法想象一个用户界面,在那里这将是一个如此出色的表现…哇,真的很管用。我以前简直不敢相信;-)请把这些信息写下来作为答案,这样我就可以把你的答案标记为正确答案。