如何编写与分辨率无关的 GWT 应用程序？

Question

我发现使应用程序分辨率独立的最佳方法是使用正确的布局，如此处所述 http://www.sencha.com/helpcenter/index.jsp?topic=/com.extjs.gxt.help/html/reference/layouts/fitlayout.html 。然而，正如示例中所使用的，面板尺寸似乎远远超出了我们在浏览器窗口中看到的尺寸，如下所示：

代码如下，IndexPage是一个Composite，其宽度/高度未设置并渲染组成部分如下：

public class Gallery implements EntryPoint {
public void onModuleLoad() {

    Viewport v = new Viewport();
    v.setLayout(new FitLayout());

    v.add(new IndexPage(), new FitData(5));

    RootPanel.get().add(v);

    }
}

解决这个问题的正确方法是什么？

Answer 1

您的 IndexPage 本身太大，无法适应视口。那么它应该做什么呢？它只能溢出/隐藏或滚动。默认情况下它会溢出，但您可以使用 setScrollMode 来更改它。

另一种方法是缩小您的 IndexPage。如何？通常您需要在页面内的某个位置添加滚动（例如允许分别滚动左侧面板和右侧面板）。没有神奇的自动检测功能，您必须决定滚动条的位置（或者可能让内容溢出），然后手动设置 ScrollContainers。然后，您可以为这些元素指定 100% 的高度（也许再次在父容器中使用 FitLayout）来填充任何空白空间。

Answer 2

一种解决方案非常简单......您可以在 Widget 外部包装一个 ScrollPanel：

public class Gallery implements EntryPoint {
public void onModuleLoad() {

Viewport v = new Viewport();
v.setLayout(new FitLayout());

ScrollPanel sp = new ScrollPanel();
sp.setHeight("100%");
sp.setWidget(new IndexPage());

v.add(sp, new FitData(5));

RootPanel.get().add(v);

}

这样，您将得到 ScrollBars。