java - Vaadin Treetable - 禁用蓝色突出显示

Question

有没有办法禁用 Vaadins TreeTable 组件中所选项目的蓝色突出显示(主要是树节点)？我使用一个标志来选择哪些项目不应该突出显示。我已经为此工作了几天，但似乎没有任何效果按预期进行。提前致谢!

Answer 1

由于树表扩展了表，因此您可以使用 cell style generator以及 theme 中的一些与表相关的 CSS 。上面的示例可能不是 100% 您正在寻找的内容，但它们应该可以帮助您入门，并且通过一些调整您就可以实现目标:

1) Java

public class TreetableWithoutSelectionBackground extends VerticalLayout {
    public TreetableWithoutSelectionBackground() {
        // standard tree table setup
        TreeTable treeTable = new TreeTable();
        treeTable.setSelectable(true);
        treeTable.setItemCaptionMode(AbstractSelect.ItemCaptionMode.ID);
        treeTable.setItemCaptionPropertyId("caption");

        // cell style generator to decide whether the item should or should not have a background
        // since we'll be using a bean item container, the itemIds will be the beans themselves so we can use those directly
        treeTable.setCellStyleGenerator((source, itemId, propertyId) -> ((MyBean) itemId).shouldHaveBackground() ? null : "no-background");

        // standard container
        BeanItemContainer<MyBean> container = new BeanItemContainer<>(MyBean.class);
        treeTable.setContainerDataSource(container);

        // add some dummy data
        Random random = new Random();
        for (int i = 0; i < 10; i++) {
            boolean shouldHaveBackground = random.nextBoolean();
            container.addItem(new MyBean("Item - " + i + " [" + shouldHaveBackground + "]", shouldHaveBackground));
        }

        addComponent(treeTable);
    }

    // basic bean
    public static class MyBean {
        private String caption;
        private boolean shouldHaveBackground;

        public MyBean(String caption, boolean shouldHaveBackground) {
            this.caption = caption;
            this.shouldHaveBackground = shouldHaveBackground;
        }

        public String getCaption() {
            return caption;
        }

        public void setCaption(String caption) {
            this.caption = caption;
        }

        public boolean shouldHaveBackground() {
            return shouldHaveBackground;
        }
    }
}

2) 主题/CSS

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

  .v-table [class*="-row-no-background"].v-selected {
    background: transparent none; // no colour & no image
    color: black;                 // make the text visible as default selection makes it white
  }
}

3) 结果