Question

Vaadin 8.1介绍了TreeGrid组件。它不再具有collapseItemsRecursively和expandItemsRecursively方法（现在在旧版Tree组件中可用）。我是否会遗漏某些内容，或者您是否需要开发自己的实现？如果是这样，建议的方法是什么？

Answer 1

我确信您已经注意到，TreeGrid是一个相当新的组件，目前正在开发并从v8.1.alphaX开始提供（当前稳定版本为v8.0.6）。因此，它可能暂时只有一些基本功能，其余的将在未来的某个时间进行，尽管不能保证。例如，this similar feature request for the older TreeTable component自2011年以来一直处于开放状态。

无论哪种方式，即使它们可能不是最佳解决方案，也可以使用一些解决方法来实现此行为。我使用无耻地作为基本样本使用了vaadin-sampler for TreeGrid中当前可用代码的略微修改版本。

public class RecursiveExpansionTreeGrid extends VerticalLayout {

    private Random random = new Random();

    public RecursiveExpansionTreeGrid() {
        // common setup with some dummy data
        TreeGrid<Project> treeGrid = new TreeGrid<>();
        treeGrid.setItems(generateProjectsForYears(2010, 2016), Project::getSubProjects);
        treeGrid.addColumn(Project::getName).setCaption("Project Name").setId("name-column");
        treeGrid.addColumn(Project::getHoursDone).setCaption("Hours Done");
        treeGrid.addColumn(Project::getLastModified).setCaption("Last Modified");
        addComponent(treeGrid);
    }

    // generate some dummy data to display in the tree grid
    private List<Project> generateProjectsForYears(int startYear, int endYear) {
        List<Project> projects = new ArrayList<>();

        for (int year = startYear; year <= endYear; year++) {
            Project yearProject = new Project("Year " + year);

            for (int i = 1; i < 2 + random.nextInt(5); i++) {
                Project customerProject = new Project("Customer Project " + i);
                customerProject.setSubProjects(Arrays.asList(
                        new LeafProject("Implementation", random.nextInt(100), year),
                        new LeafProject("Planning", random.nextInt(10), year),
                        new LeafProject("Prototyping", random.nextInt(20), year)));
                yearProject.addSubProject(customerProject);
            }
            projects.add(yearProject);
        }
        return projects;
    }

    // POJO for easy binding
    public class Project {
        private List<Project> subProjects = new ArrayList<>();
        private String name;

        public Project(String name) {
            this.name = name;
        }

        public String getName() {
            return name;
        }

        public List<Project> getSubProjects() {
            return subProjects;
        }

        public void setSubProjects(List<Project> subProjects) {
            this.subProjects = subProjects;
        }

        public void addSubProject(Project subProject) {
            subProjects.add(subProject);
        }

        public int getHoursDone() {
            return getSubProjects().stream().map(project -> project.getHoursDone()).reduce(0, Integer::sum);
        }

        public Date getLastModified() {
            return getSubProjects().stream().map(project -> project.getLastModified()).max(Date::compareTo).orElse(null);
        }
    }

    // Second POJO for easy binding
    public class LeafProject extends Project {
        private int hoursDone;
        private Date lastModified;

        public LeafProject(String name, int hoursDone, int year) {
            super(name);
            this.hoursDone = hoursDone;
            lastModified = new Date(year - 1900, random.nextInt(12), random.nextInt(10));
        }

        @Override
        public int getHoursDone() {
            return hoursDone;
        }

        @Override
        public Date getLastModified() {
            return lastModified;
        }
    }
}

接下来，递归地扩展或折叠节点取决于您的场景，但基本上它分解为相同的事情：确保从根到最深的叶子的每个节点都被展开/折叠。最简单的方法是将您的层次结构展平到一个节点列表中，并调用适当的方法expand(List<T> items)或expand(T ... items)（第二个委托给第一个，可能是一个方便的方法，例如{ {1}}）。

为简单起见，我在expand(myItem)实施中添加了flatten方法。如果由于某种原因你不能这样做，那么创建一个递归方法，创建一个以所选节点开始的列表，并包括孩子们的所有孩子，孩子们......好吧，你明白了

Project

可能的情况：

展开根目录时自动展开整个层次结构 - 添加侦听器，展开/折叠整个展平层次结构：

public Stream<Project> flatten() {
    return Stream.concat(Stream.of(this), getSubProjects().stream().flatMap(Project::flatten));
}

使用自定义操作（例如上下文菜单）

treeGrid.addCollapseListener(event -> {
    if (event.isUserOriginated()) {
        // event is triggered by all collapse calls, so only do it the first time, when the user clicks in the UI
        // and ignore the programmatic calls
        treeGrid.collapse(event.getCollapsedItem().flatten().collect(Collectors.toList()));
    }
});
treeGrid.addExpandListener(event -> {
    if (event.isUserOriginated()) {
        // event is triggered by all expand calls, so only do it the first time, when the user clicks in the UI
        // and ignore the programmatic calls
        treeGrid.expand(event.getExpandedItem().flatten().collect(Collectors.toList()));
    }
});

最后，你应该得到这个效果：

Answer 2

从docs for treegrid开始，您可以使用方法collapse和expand，通过传递treegrid数据项的列表或数组来展开或折叠：

treeGrid.expand(someTreeGridItem1, someTreeGridItem2);
treeGrid.collapse(someTreeGridItem1);

另外值得注意的是，该部分显示了prevent certain items from ever being collapsed

的能力

在Vaadin 8.1 TreeGrid中替换collapseItemsRecursively和expandItemsRecursively

2 个答案: