Vaadin 删除Gridlayout中第一行和第二行之间的间距

非常感谢您事先的帮助

让我解释一下问题

我有网格布局，在第一行（称为标题行）添加标签。在接下来的5行中，我添加了文本字段、组合字段和日期字段

我面临的问题是，我想删除标题（第一）行和第二行之间的空格，并继续保留从第二行到最后一行的默认空格。我已在快照中将空间突出显示为红线

请在附件中找到快照。

---

任何提示，请告知。

正如我在评论中提到的，组件在网格布局中的位置由

css

中的

top

值定义。因此，如果您想重新定位（在本例中是删除空间）一个元素，则需要对其进行更改。这里的问题是

• GridLayout不必从顶部开始，因此您需要为顶部计算一个正确的值
• 然后，您需要使用

  ：n-th

  子级来区分正确的组件（本例中的标签），因为应用于组件的类名不会传播到父级的

  v-gridlayout-slot

作为替代方案，您可以向所有组件（标签除外）添加一个通用样式名，并使用此样式集边距（

左

，

右

，

下

）向所有组件添加边距。（在下面的示例中，使用粉红色验证是否应用了样式。）

在此场景中，输出如下所示：

css部分：

.addPadding{
    margin-bottom: 15px;
    margin-left: 15px;
    margin-right: 15px;
    background-color: pink;
  }

使用的代码：

setContent（addGridLayout（））
////
私有GridLayout addGridLayout（）{
//创建一个4乘4的网格布局。
GridLayout grid=新的GridLayout（4,4）；
//grid.setspace（true）；
addStyleName（“示例gridlayout”）；
//使用光标填写第一行。
对于（int i=0；i<4；i++）{
标签l=新标签（“Col”+
（grid.getCursorX（）+1））；
网格。添加组件（l）；
grid.setComponentAlignment（左对齐，底部对齐，中间对齐）；
}
//使用坐标填写第一列。
对于（int i=1；i<4；i++）{
TextField x=新的TextField（）；
x、 addStyleName（“addPadding”）；
grid.addComponent（x，0，i）；
}
//使用坐标填写第二列。
对于（int i=1；i<4；i++）{
TextField x=新的TextField（）；
x、 addStyleName（“addPadding”）；
网格。添加组件（x，1，i）；
}
//使用坐标填写第三列。
对于（int i=1；i<4；i++）{
DateField x=新的日期字段（）；
x、 addStyleName（“addPadding”）；
网格。添加组件（x，2，i）；
}
//使用坐标填写第三列。
对于（int i=1；i<4；i++）{
ComboBox x=新的ComboBox（）；
x、 addStyleName（“addPadding”）；
网格。添加组件（x，3，i）；
}
返回网格；
}

如果列的宽度固定，则可以创建两个网格布局，一个用于标题，另一个用于内容。它们都应该没有边距，并且包含它们的布局应该没有间距。

您可以在vaadin网格中设置阴影thead的样式。你知道如何设计vaadin组件吗？@Simon，我不知道你知道CSS吗？查看文档：然后返回并询问是否有不清楚的地方。不幸的是，Vaadin 8使用GWT组件，因此该链接在Vaadin 8的情况下没有帮助。没有要更改的填充/边距设置，如

top

标记定义的位置（因此，除了通过更改顶部值来重新定位元素外，基本上无法删除此空白）。我在想，也许您可以尝试删除

setspace（true）

，只需将

margin-bottom

添加到除标签组件之外的所有组件中。这不是一个理想的解决方案，但有点像是一种变通方法，如果它起作用的话（我没有检查过）