Vaadin网格表：如何禁用排序功能并设置一列的颜色 [英] Vaadin Grid Table : How to disable Sort Function and set the color of one column

问题描述

我在Vaadin中使用 Grid 表进行数据表示。
为此，我试图找出以下两个问题：

1。）如何禁用每个列的标题中的排序功能

2。）如何设置表格中一列的颜色

解决方案

首先，我发现

I'm using Grid table in Vaadin for data representation. For that I'm trying to figure out the following two issues:

1.) How to disable the sort function in the Header of each column

2.) How to set the color of one column in a Grid table

解决方案

First of all, I find the Vaadin docs a good place to start looking for help. For the rest of the exercise, suppose we have a Grid with 3 simple columns c1, c2 & c3:

Grid grid = new Grid();
grid.addColumn("c1", String.class);
grid.addColumn("c2", String.class);
grid.addColumn("c3", String.class);

1.) How to disable the sort function in the Header of each column

Iterate through each column and set its sortable property to false:

for (Grid.Column column : grid.getColumns()) {
    column.setSortable(false);
}

Or just get that one column you want and set its sortable property:

grid.getColumn("c1").setSortable(false);

2.) How to set the color of one column in a Grid table

Similar to how it was done with the table, you need to define your CSS style in your theme:

@import "../valo/valo.scss";

@mixin mytheme {
  @include valo;
  // Insert your own theme rules here

  .v-grid-cell.green {
    background: #33BB00;
  }
}

And use a CellStyleGenerator to apply the style to your desired column:

grid.setCellStyleGenerator(new Grid.CellStyleGenerator() {
    @Override
    public String getStyle(Grid.CellReference cellReference) {
        if ("c1".equals(cellReference.getPropertyId())) {
            return "green";
        } else {
            return null;
        }
    }
});

Which should generate something along the lines of:

这篇关于Vaadin网格表：如何禁用排序功能并设置一列的颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！