首页 > 解决方案 > 如何增加 Vaadin 11.0.0 网格中的行高?

问题描述

我想在 Vaadin 11 的网格中实现自动换行。据我了解,您需要为此做两件事:

  1. 设置相应单元格的样式。
  2. 增加行高。

我使用以下代码完成了第一步:

productsGrid.addColumn(TemplateRenderer.of("[[item.name]]") .withProperty("name", Product::getName)) .setHeader("Name");

现在我需要增加行高。

也许可以使用productsGrid.getElement().getStyle().set(...),但我不确定如何使用它。

如何增加 Vaadin 11 网格中行的高度(即使行更高,以便我可以在单元格中显示长文本)?

更新 1:

我正在使用以下代码来创建网格:

private Grid<Product> createProductsGrid() {
    final Grid<Product> productsGrid = new Grid<Product>();
    productsGrid.setItems(Arrays.asList(AltFondUtilities.INSTANCE));
    productsGrid.addColumn(TemplateRenderer.<Product>of(
                    "<div style='word-wrap: break-word;'>[[item.name]]</div>")
                    .withProperty("name", Product::getName))
                    .setHeader("Название");
    productsGrid.addColumn(Product::getInterestRatePercentPerAnnum)
                    .setHeader("Ставка");
    productsGrid.addColumn(Product::getProvider).setHeader("Организация");
    productsGrid.setHeightByRows(true);
    return productsGrid;
}

name结果:即使列具有正确的样式,自动换行也不起作用。

截屏

标签: javacssvaadinvaadin-grid

解决方案


从 Vaadin 11 的Java Examples of Grid看来,这可以通过使用setHeightByRows

Grid<Person> grid = new Grid<>();

// When using heightByRows, all items are fetched and
// Grid uses all the space needed to render everything.
grid.setHeightByRows(true);

推荐阅读