Java 如何使vaadin不显示滚动条（在主布局中使用setSizeFull时）

给出以下吹嘘示例应用程序：

package net.kerba.vaadin7interface;

import com.vaadin.annotations.Theme;
import com.vaadin.annotations.VaadinServletConfiguration;
import com.vaadin.server.VaadinRequest;
import com.vaadin.server.VaadinServlet;
import com.vaadin.shared.ui.label.ContentMode;
import com.vaadin.ui.*;

import javax.servlet.annotation.WebInitParam;
import javax.servlet.annotation.WebServlet;

/**
 * Created by IntelliJ IDEA.
 * Date: 19.11.13
 * Time: 20:48
 */

@Theme("runo")
public class MainUi extends UI {

    @Override
    protected void init(VaadinRequest request) {

        GridLayout main = new GridLayout();
        main.setSizeFull();
        main.setMargin(false);

        Panel panel = new Panel("Working area");
        main.addComponent(panel, 0, 0);

        // magic goes in 2 lines below
        panel.setWidth("500px");
        panel.setHeight("300px");

        panel.setContent(new Label("foobar");", ContentMode.PREFORMATTED));

        main.setComponentAlignment(panel, Alignment.MIDDLE_CENTER);
        setContent(main);
    }

    @WebServlet(name = "vaadinServlet",
            urlPatterns = {"/app/*", "/VAADIN/*"},
            asyncSupported = false,
            initParams = {@WebInitParam(
                    name = "widgetset",
                    value = "com.vaadin.DefaultWidgetSet"
            )}
    )
    @VaadinServletConfiguration(productionMode = false, ui = MainUi.class)
    public static class Servlet extends VaadinServlet {

    }
}

当我使用%表示宽度和高度时：

panel.setWidth("50%");
panel.setHeight("50%");

我得到两个滚动条：

当我使用像素表示宽度和高度时：

panel.setWidth("500px");
panel.setHeight("300px");

两个滚动条都消失了：

如何使用%表示宽度和高度，并使Vaadin不显示滚动条

---

Vaadin 7.1.8

我发现，通过扩展例如runo或Reinder来引入你自己的主题总是值得的。然后，您可以在

面板
上声明一个类，并在CSS中而不是在代码中设置其宽度/高度。通过这种方式，浏览器可以在任何JS执行之前设置大小，因此在JS之前就知道在这种情况下不需要滚动条。
这是因为使用GridLayout编写

main.setComponentAlignment(panel, Alignment.MIDDLE_CENTER);

它实际上设置了屏幕中间的网格布局插槽，使屏幕的大小为100%，从这50%个是你的面板——对我来说，它似乎是一个bug…
解决方法是使用不同的布局，垂直布局也可以。或者用CustomLayout伪造网格布局。
我对解决方案不是很确定，但在网上参考时。我发现了几个链接，我认为这些链接可以帮助您解决问题：



据其

main.setComponentAlignment(panel, Alignment.MIDDLE_CENTER);

使它位于屏幕的中间，即，实际上一半的面板被定义。
您可以创建另一个具有不同规格的面板，也可以使用虚拟视图来解决此问题，即网格布局，仅用于格式化缩进并根据您的使用对其进行有效自定义
使用HGap、VGap，然后设置对齐。参考此
使用完全不同的布局，对布局定位的当前规范进行一些更改
虽然Vaadin中的一个bug看起来确实是一个迷人的解释，但我怀疑它的真实性，因为这个问题太普遍了。你对这个假设有实际的证据或合理的解释吗？我认为这是错误的，因为将面板设置在中间，你希望面板本身在中间，而不是插槽div。所以在我看来插槽应该占据整个浏览器窗口，面板应该居中。你提到的链接谈到swing，但问题是关于瓦丁网格布局。