4

我正在尝试基于 Vaadin 网格组件实现表格。某些字段包含大量文本,并且在这种情况下,网格总是显示单行而不是多行。

我试图根据vaadin forum的一些想法修改 CSS ,但我得到了相同的结果。同样在网格标题的相同情况下,它显示带有省略号的单行。

请提供任何想法如何解决它?

4

1 回答 1

4

Grid 从客户端管理这种风格,我们不能也不应该直接控制它。

但是 Grid 组件提供了一种显示隐藏数据或细节的方法DetailsGenerator

但是,对于标题,我们无能为力,因为唯一的解决方案是使标题尽可能小且具有描述性。但我仍然认为标题上的自动换行看起来不太好。

以下示例管理有关项目选择的详细信息的可见性,

Grid g = new Grid();
g.addColumn("num");
g.addColumn("val");

g.setWidth(400, Unit.PIXELS);
g.setHeight(300, Unit.PIXELS);

g.getColumn("num").setWidth(100);
g.getColumn("val").setWidth(300);

g.addRow("1", "This is just a simple test. No need to take it too seriously, please !!!!");
g.addRow("2", "This is just a simple test. No need to take it too seriously, please !!!!");
g.addRow("3", "This is just a simple test. No need to take it too seriously, please !!!!");
g.addRow("4", "This is just a simple test. No need to take it too seriously, please !!!!");

g.addItemClickListener(new ItemClickListener() {

    /**
     * 
     */
    private static final long serialVersionUID = 1L;

    @Override
    public void itemClick(ItemClickEvent event) {
        g.setDetailsVisible(event.getItemId(), !g.isDetailsVisible(event.getItemId()));
    }
});

g.setDetailsGenerator(new DetailsGenerator() {

    /**
     * 
     */
    private static final long serialVersionUID = 1L;

    @Override
    public com.vaadin.ui.Component getDetails(RowReference rowReference) {
        String value = (String)rowReference.getItem().getItemProperty("val").getValue();
        Label val = new Label();
        val.setValue(value);
        val.addStyleName(ValoTheme.LAYOUT_HORIZONTAL_WRAPPING);
        return val;
    }
});

在此处输入图像描述

于 2016-08-16T06:13:32.033 回答