Custom part names can depend on the position of an item in the hierarchy. In the example below, selecting a row highlights all of its descendants with a selected-subtree part name. The part name generator checks whether the selected item is an ancestor of the rendered item. Because part names are generated only when a row is rendered, the selection listener refreshes the descendants of both the previously and the newly selected item.
Source code TreeGridSubtreeHighlight.java tree-grid-subtree-highlight.css
Expand code
TreeGridSubtreeHighlight.java package com.vaadin.demo.component.treegrid;
import com.vaadin.demo.domain.DataService;
import com.vaadin.demo.domain.Person;
import com.vaadin.flow.component.html.Div;
import com.vaadin.flow.component.treegrid.TreeGrid;
import com.vaadin.flow.data.provider.hierarchy.HierarchicalDataProvider.HierarchyFormat;
import com.vaadin.flow.data.provider.hierarchy.TreeData;
import com.vaadin.flow.data.provider.hierarchy.TreeDataProvider;
import com.vaadin.flow.router.Route;
@Route("tree-grid-subtree-highlight")
public class TreeGridSubtreeHighlight extends Div {
private final TreeGrid<Person> treeGrid = new TreeGrid<>();
private final TreeData<Person> treeData = new TreeData<>();
public TreeGridSubtreeHighlight() {
treeData.addItems(DataService.getManagers(),
manager -> DataService.getPeople(manager.getId()));
treeGrid.setDataProvider(
new TreeDataProvider<>(treeData, HierarchyFormat.FLATTENED));
treeGrid.addHierarchyColumn(Person::getFullName).setHeader("Full name");
treeGrid.addColumn(Person::getProfession).setHeader("Profession");
// tag::snippet[]
treeGrid.setPartNameGenerator(person -> {
Person selected = treeGrid.asSingleSelect().getValue();
return isDescendantOf(person, selected) ? "selected-subtree" : null;
});
treeGrid.asSingleSelect().addValueChangeListener(event -> {
// Regenerate the part names of the previous and new subtree
refreshDescendants(event.getOldValue());
refreshDescendants(event.getValue());
});
// end::snippet[]
treeGrid.expand(DataService.getManagers().get(0));
add(treeGrid);
}
// tag::snippet[]
private boolean isDescendantOf(Person person, Person ancestor) {
if (ancestor == null) {
return false;
}
Person parent = treeData.getParent(person);
while (parent != null) {
if (parent.equals(ancestor)) {
return true;
}
parent = treeData.getParent(parent);
}
return false;
}
private void refreshDescendants(Person person) {
if (person == null) {
return;
}
for (Person child : treeData.getChildren(person)) {
treeGrid.getDataProvider().refreshItem(child);
refreshDescendants(child);
}
}
// end::snippet[]
}
tree-grid-subtree-highlight.css /* Add this to your global CSS, for example in: */
/* src/main/resources/META-INF/resources/styles.css */
vaadin-grid::part(selected-subtree) {
/* Aura */
--vaadin-grid-cell-background-color: color-mix(in srgb, currentColor 4%, transparent);
/* Lumo */
--vaadin-grid-cell-background: color-mix(in srgb, currentColor 4%, transparent);
}
tree-grid-subtree-highlight.css