Gwt 创建简单的垂直布局？无法填满所有空间

我在设置简单布局时遇到问题。我想要一个垂直面板下面的画布。比如：

VerticalPanel parent = new VerticalPanel();
parent.setWidth("100%");
parent.setHeight("100%");

HorizontalPanel hp = new HorizontalPanel();
hp.setWidth("100%");
parent.add(hp);

Canvas canvas = Canvas.createIfSupported();
canvas.setWidth("100%");
canvas.setHeight("100%");
parent.add(canvas);

因此，基本上我希望顶部面板“hp”的高度与其内容所需的高度相同，页面的其余部分应该填充canvas元素。但我得到了奇怪的效果，画布似乎只填充了屏幕的一部分等。它在布局后报告其高度约为200px，而可用高度应约为600px

---

谢谢

画布可能不会占用所有空间，因为它不包含任何内容，或者因为没有设置大小，默认为300px。见此：

更新：

垂直和水平面板只是HTML表格。它们将占据与内容物高度相同的空间

相反，您可以使用：

---

另请检查：

但是否将其高度设置为100%会告诉浏览器将其拉伸到其父级的高度？另一个问题是，我的画布默认显示为：inline-因此我一直在画布周围使用奇怪的空白。更改为显示：已删除该块，并且工作情况更好。谢谢

public void onModuleLoad() 
{
    DockLayoutPanel dockLayoutPanel = new DockLayoutPanel(Unit.PCT);
    dockLayoutPanel.addNorth(new Label("My header"),5);

    Canvas canvas = Canvas.createIfSupported();
    canvas.getElement().getStyle().setBackgroundColor("red");
    canvas.setWidth("100%");
    canvas.setHeight("100%");

    dockLayoutPanel.add(canvas);

    RootLayoutPanel.get().add(dockLayoutPanel);
}