Vaadin 10+ Tree Grid: Hierarchies and how they work?

Question

I have been trying to do a Vaadin tree grid with a more complex hierarchy. Since the documentation for this framework is very obscure and feels tad incomplete, I found this blog thread that helped me out only to get multiple children to a single parent.

However, I want to have a much more complex system where the children would have their own branches (children of children?).

For example:

So now I am stuck with this bit of code and I am unsure if I am going the right way or not.

        TreeGrid<TreeDto> grid = new TreeGrid<>(TreeDto.class);
        grid.setHierarchyColumn("name");

        List<TreeDto> parenlist = new ArrayList<TreeDto>();
        List<TreeDto> childList = new ArrayList<TreeDto>();
        for(DataDepartment department : departmentLists) 
        {
            TreeDto parent = new TreeDto(department.getDepName(), null);
            for(DataGeneralSection section: sectionList) 
        {
                childList.add(new TreeDto(section.getSection(), parent));
            }
            parenlist.add(parent);
        }

        List<TreeDto> newList = new ArrayList<TreeDto>(parenlist);
        newList.addAll(childList);

        newList.forEach(p -> grid.getTreeData().addItem(p.getParent(), p));
        abteilungenTabs.add(grid);

Does anybody have any idea how I can achieve the hierarchy I want?

Since you are asking for V10 and show a screenshot for V8, you should be very careful not to mix versions. In theory V10 is a breaking change - some things will be the same, others don't. — cfrick, Mar 02 '20 at 14:30

score 3 · Answer 1 · answered Mar 02 '20 at 14:36

You can just continue deeper with your current approach. If you have a lot of items, you might want to consider a data provider like Simon Martinelli suggested.

public class MainView extends VerticalLayout {

    public MainView() {
        TreeGrid<TreeItem> treeGrid = new TreeGrid<>();
        treeGrid.addHierarchyColumn(TreeItem::getValue);

        setSizeFull();
        treeGrid.setSizeFull();

        for (Company company: getCompanies()) {
            TreeItem companyItem = new TreeItem(company.getCompanyName());
            treeGrid.getTreeData().addItem(null, companyItem);

            for(Department department: company.getDepartments()) {
                TreeItem departmentItem = new TreeItem(department.getName());
                treeGrid.getTreeData().addItem(companyItem, departmentItem);

                for(Employee employee: department.getEmployees()) {
                    TreeItem employeeItem = new TreeItem(employee.getFullName());
                    treeGrid.getTreeData().addItem(departmentItem, employeeItem);
                }
            }
        }

        add(treeGrid);
    }
}

score 2 · Accepted Answer · answered Mar 02 '20 at 13:53

You must use a HierachicalDataProvider that provides the data.

For example:

 dataProvider = new AbstractBackEndHierarchicalDataProvider<>() {
            @Override
            public int getChildCount(HierarchicalQuery<TreeNode, Void> hierarchicalQuery) {
                if (hierarchicalQuery.getParent() == null) {
                    if (root == null) {
                        return 0;
                    } else {
                        return root.getChildren().size();
                    }
                } else {
                    return hierarchicalQuery.getParent().getChildren().size();
                }
            }

            @Override
            public boolean hasChildren(TreeNode treeNode) {
                return !treeNode.getChildren().isEmpty();
            }

            @Override
            protected Stream<TreeNode> fetchChildrenFromBackEnd(HierarchicalQuery<TreeNode, Void> hierarchicalQuery) {
                if (hierarchicalQuery.getParent() == null) {
                    if (root == null) {
                        return Stream.empty();
                    } else {
                        return root.getChildren().stream().skip(hierarchicalQuery.getOffset()).limit(hierarchicalQuery.getLimit());
                    }
                } else {
                    return hierarchicalQuery.getParent().getChildren().stream().skip(hierarchicalQuery.getOffset()).limit(hierarchicalQuery.getLimit());
                }
            }
        };
        treeGrid.setDataProvider(dataProvider);

Vaadin 10+ Tree Grid: Hierarchies and how they work?

2 Answers2