Question

我正在使用GWT 2.3并且我认为这是一种非常常见的布局方案，似乎不太受支持 - 但我希望StackOverflow可以告诉我，我正在查看错误的问题。

我正在使用布局面板来安排我的应用。通常，您将布局面板放入RootLayoutPanel，它将占据整个浏览器窗口。

但是，我有一个站点页眉和页脚需要在GWT之外。

问题是，正如docs明确指出的那样，如果将布局面板插入页面的任意HTML元素而不是使用RootLayoutPanel，则会丢失自动调整大小的行为。您必须指定布局面板的起始大小，并手动调整大小。

如何实现此手动调整大小？我很确定我可以通过javascript跟踪HTML元素的大小调整，但是如何与GWT交互以告诉它新的大小？

谢谢！

Answer 1

我建议在你的html文件中使用css绝对定位：

<body style='position:absolute; top:10em; bottom:10em; left:0; right:0;>
  <div id="top" style="position:absolute; left:0; top:-10em; bottom:0; right:0;">
    <p> THIS IS THE TOP BANNER </p>
  </div>

    <div id="bottom" style="position:absolute; left:0; top:100%; bottom:0; right:0;">
      <p> THIS IS THE BOTTOM BANNER </p>
    </div>

</body>

您的RootLayoutPanel将附加到正文，该正文现在有一个10em的上边距和下边距。

Answer 2

一种可能的纯GWT解决方案。您可以添加调整大小处理程序。在resize事件中，您可以获取新尺寸并调整组件大小。

GWT邮件样本前GWT 2.0邮件使用“手动”调整大小（但它有点过时）。

http://code.google.com/p/google-web-toolkit/source/browse/releases/1.7/samples/mail/src/com/google/gwt/sample/mail/client/Mail.java

基本上，你想要挂钩窗口调整大小事件处理程序：

 // Hook the window resize event, so that we can adjust the UI.
 Window.addResizeHandler(new ResizeHandler() {
   public void onResizeA(int width, int height) {
     // Adjust each immediate child widget by calling child.onResize() 
   }
 }

GWT：没有RootLayoutPanel的可调整大小的布局？

2 个答案: