Question

我正在尝试创建一个CustomComponent，其中我有两列（可能是四列），其中两列是Labels行。第一列是标识符，如“Firstname：”，“Lastname：”等，第二列是标识符的实际值，如“John”，“Smith”等。

我正在使用GridLayout，以便数据排列整齐（例如，约翰在下一行与史密斯排成一行）。

我遇到的问题是我希望第二列明智地占用空间的剩余部分，并且当文本太长时将文本换行到下一行。因此，例如，如果我有一个段落的评论Label，我希望文本包装，但它只是不在屏幕上。

现在我理解the Label needs to have a defined width to be able to wrap the text但是我无法弄清楚如何使用它来在网格包装中的标签中制作文本。我已经尝试了我能想到的一切。

我的代码是：

GridLayout gridLayout = new GridLayout();
gridLayout.setColumns(2);
gridLayout.setColumnExpandRatio(0, 1f);

gridLayout.addComponent(new Label("Firstname"));
gridLayout.addComponent(firstnameValueLabel);
gridLayout.addComponent(new Label("Lastname"));
gridLayout.addComponent(lastnameValueLabel);
// and so on.

VerticalLayout verticalLayout = new VerticalLayout();
verticalLayout.addComponent(myHeaderComponent);
verticalLayout.addComponent(gridLayout);

我已经尝试了所有我能想到的valueLabel（firstnameValueLabel等）文本包装，但似乎没有任何效果。我尝试将特定尺寸分配给GridLayout，VerticalLayout，而不是100％，依此类推，但没有任何成功。我正在使用VerticalLayout，因为我在数据之上还有其他内容。

也许使用GridLayout不是最佳选择，也许有更好的方法来排列非字段的表单。虽然FormLayout是完美的，但它似乎只适用于输入字段。

在任何情况下，我应该如何实现这一点，以便Label文本换行？

Answer 1

答案是各种各样的事情。首先，我能提供的最大提示是查看Consume available space in Vaadin Gridlayout, but consider line breaks

之后，上面的代码在setValue()使用WHERE user_permit_doc_id = 10时就会使用function(doc) { if(doc.user_permit_doc_id === 10 && doc.user_tracking_id === 1){ emit(doc); } }。

将这两件事情结合起来解决了这个问题并解决了文字问题。

Answer 2

做

int colums = 2;
int rows = 0;
GridLayout gridLayout = new GridLayout(colums,rows);

希望有所帮助

Vaadin - 如何拥有两列数据（包含字段的Gridlayout和包含文本的标签数据）

2 个答案: