Java 瓦丁板之间的巨大空间

我编写的这段代码创建了两个面板。目的是让其中一个直接位于另一个之上，中间没有空间，但问题是它们之间存在巨大的差距

谁能帮我解决这个问题吗

代码：

---

这取决于已设置为全尺寸的

布局类型。您的
布局
将与浏览器本身一样扩展。如果您的
布局
是一个
垂直布局
，则其高度为100%，但只有两个面板，其高度分别为300和100。由于您没有指定任何，Vaadin将50%的屏幕分配给
面板
，将另外50%分配给
徽标
，因此您会在两者之间获得很大的差距

要修复它，您可以做两件事：

不要使用
layout.setSize（）layout.setSizeUndefined（）

使用扩展比率，使顶部的
面板
获得更少的空间，而
徽标
获得更多的空间：
布局。设置扩展比率（面板，0.2f）和
布局。设置扩展比（徽标，0.8f）。这种方法的问题是，如果浏览器高度小于400像素，布局将被切断

我花了一段时间和许多尝试/错误来学习这个概念。请确保在继续阅读之前仔细阅读本页。
有两种方法：


正如@Abbas所说，使用

layout.setExpandRatio（面板、浮动）

也可以在css文件中添加属性：

layout.setStyleName（“我的布局”）


在css中添加：

.v-verticallayout-my-layout .v-slot{
  height: auto !important;
}

这就行了。我尝试了这两种方法，它们都有效。
您键入了扩展比率方法的名称。这是“比率”而不是“定量”。嘿，谢谢你的帮助！layout.setSizeUndefined（）；成功了，但是组件现在都卡在左侧，对齐不起作用。你知道为什么吗？那是因为它们的封闭双亲（
layout1
和
layout2
）是全尺寸的，即它们的宽度和高度是100%。要解决这个问题，只需设置未定义的
layout1
和
layout2
的大小（
layout1.setSizeUndefined（）；
）。此外，我相信您实际上并不需要
layout1
和
layout2
。只需将
面板
和
徽标
直接添加到
布局
下即可。要想让布局看起来完全符合您的要求，一个好办法是在Chrome或Safari中检查生成页面的HTML代码，并调整高度和宽度以获得正确的布局。“确保在继续之前仔细阅读本页。”-非常值得一读。
.v-verticallayout-my-layout .v-slot{
  height: auto !important;
}