GWT Layout：“占用剩余空间。”答案

【问题标题】：GWT Layout: "take up the rest of the space."GWT Layout：“占用剩余空间。”
【发布时间】：2010-11-02 16:57:06
【问题描述】：

我现有的布局是两个 div 的堆栈 - 布局面板中的 g:layers。顶部 div 应该与包含其内容所需的一样大。底部 div 应该占据屏幕上的其余空间，而不会导致出现滚动条。

top div的内容可以改变，所以top div的大小可以改变。

我当前的解决方案是在顶部 div 的内容发生变化时触发回调。然后包含的 LayoutPanel 可以重新计算顶部 div 的大小，并显式设置第二层的 top 和 bottom 属性以占用其余空间。有没有更好的办法？类似的，

<g:LayoutPanel>
    <g:layer top="0px" height="whatever you need, baby">
        <c:SomeWidget/>
    </g:layer>
    <g:layer top="the bottom of the first layer" bottom="0px">
        <c:Anotherwidget/>
    </g:layer>
</g:LayoutPanel>

【问题讨论】：

如果您根本不需要滚动条，那么有一个简单的解决方案：使用带有 overflow: hidden 的 FlowPanel。但我假设，当底部面板溢出时，您确实希望出现滚动条？我也希望看到一个解决方案（我的意思是一个也可以在严格模式下工作的解决方案）。不确定，是否可以使用 CSS 2.1 (?)
是的，我确实需要第二层的 ScrollPanel 的大小。啊。

标签： gwt layout uibinder

【解决方案1】：

用DockLayoutPanel怎么样？

<g:DockLayoutPanel unit='PX'>
  <north size="10" ui:field='northWidget'>
    <c:SomeWidget/>
  </north>
  <center>
    <c:Anotherwidget/>
  </center>
</g:DockLayoutPanel>

然后center 将占用其余空间。如果要调整顶部大小，请致电 setWidgetSize(northWidget, newSize); 和 center 小部件将被重新计算。

【讨论】：

但是我还是得计算northWidget的大小，对吧？我正在寻找一种在northWidget 改变大小时会自动流动的解决方案。

【解决方案2】：

答案似乎是没有更好的方法。习惯了手动重新计算也不错！

【讨论】：

【解决方案3】：

我认为 HeaderPanel 是执行此操作的标准 Widget。也许它是在提出问题后添加的。我们也错过了它，有一段时间有自己的版本。

【讨论】：