如何在Vaadin 8中有条件地为网格行着色?

时间:2017-06-30 08:48:45

标签: java sass vaadin vaadin-grid vaadin8

我想根据单元格的值更改Vaadin网格行的颜色。我尝试了如下,但没有用。

SCSS

@import "mytheme.scss";
@import "addons.scss";

// This file prefixes all rules with the theme name to avoid causing conflicts with other themes.
// The actual styles should be defined in mytheme.scss

.mytheme {
     @include addons;
     @include mytheme;

     .v-grid-row.error_row {
            // Tried following elements and didn't work.
            // background-color: red !important;
            // color: blue !important; // This changed the color of the font.
            background: green !important;
     }
}

Java代码

grid.setStyleGenerator(t -> {
            if (t.getLogLevel().trim().equals(ERROR) || t.getLogLevel().trim().equals(WARN)) {
                return "error_row";
            } else {
                return null;
            }
        });

注意:我从浏览器的开发者工具中查看了css,并显示css已正确更新(参见下图)。

enter image description here

1 个答案:

答案 0 :(得分:14)

您需要覆盖行的TD元素的background-color

.v-grid-row.error_row > td {
    background-color: red;
}

通过使用浏览器的样式检查,您可以看到Vaadin如何实现样式。