gwt - GWT：像任何其他 Web 应用程序一样适合浏览器的组合

Question

我是 GWT 的新手，现在才开始布局。我创建了一个登录屏幕（布局：在页面中心），然后在成功登录后移动到具有文档面板并添加了一些组件的第二页。

当我启动它时，它出现在网页的中心。我希望它根据浏览器/屏幕的大小覆盖整个页面。

我如何到那里？请帮忙。

还请分享使用导航到 2,3 页面的任何小型 GWT 应用程序（带有源代码）。

Answer 1

这为我做到了。（覆盖是我想要覆盖屏幕的 div）。

    public void coverScreen() {
        overlay.setHeight(getHeight() + "px");
        overlay.setWidth(Document.get().getBody().getClientWidth() + "px");
    }

    private static native int getHeight() /*-{
        if ($doc.documentElement.clientHeight && $doc.body.clientHeight) {
            if ($doc.documentElement.clientHeight > $doc.body.clientHeight) {
                return $doc.documentElement.clientHeight;
            } else {
                return $doc.body.clientHeight;
            }
        } else if ($doc.body.clientHeight) {
            return $doc.body.clientHeight;
        } else if ($doc.documentElement.clientHeight) {
            return $doc.documentElement.clientHeight;
        } else {
            return 0;
        }
    }-*/;

编辑

我致力于避免覆盖滚动条的功能。

 private static native int getScrollbarWidth() /*-{
    var body = $doc.body;
    body.style.overflow = 'hidden';
    var width = body.clientWidth;
    body.style.overflow = 'scroll';
    width -= body.clientWidth;
    if (!width)
        width = body.offsetWidth - body.clientWidth;
    body.style.overflow = '';
    return width;
  }-*/;

setWidth 调用变为。

 overlay.setWidth(Document.get().getBody().getClientWidth() - getScrollbarWidth() + "px");

div CSS如下

position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
z-index: 6790;
margin: 0px !important;
background-color: rgb(0, 0, 0);
opacity: 0.8;