代码之家  ›  专栏  ›  技术社区  ›  rmuller

Vaadin 8.1 TreeGrid中Collapseitems和ExpandItems的替换

  •  0
  • rmuller  · 技术社区  · 9 年前

    Vaadin 8.1介绍了 TreeGrid collapseItemsRecursively expandItemsRecursively Tree 组件)。我是否遗漏了什么,或者您是否需要开发自己的实现?如果是这样,建议采用什么方法?

    2 回复  |  直到 9 年前
        1
  •  2
  •   Morfic    9 年前

    this similar feature request for the older TreeTable component 自2011年以来一直处于开放状态。

    Vaadin docs warning

    无论哪种方式,即使它们可能不是最佳解决方案,您也可以使用一些变通方法来实现此行为。我是 无耻地 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) (第二种方法代表第一种方法,可能是一种方便的方法,例如 expand(myItem)

    flatten 我们的方法 Project 实施如果由于某种原因不能这样做,那么创建一个递归方法,该方法创建一个从所选节点开始的列表,并包括所有子节点、子节点和子节点……好吧,你明白了。

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

    可能的情况:

    1. 在展开根时自动展开整个层次结构-添加侦听器,并展开/折叠整个层次结构 等级制度:
    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()));
        }
    });
    
    1. 使用自定义操作(如关联菜单)扩展层次结构或其一部分
    GridContextMenu<Project> contextMenu = new GridContextMenu<>(treeGrid);
    contextMenu.addGridBodyContextMenuListener(contextEvent -> {
        contextMenu.removeItems();
        if (contextEvent.getItem() != null) {
            Project project = (Project) contextEvent.getItem();
            // update selection
            treeGrid.select(project);
    
            // show option for expanding
            contextMenu.addItem("Expand all", VaadinIcons.PLUS, event -> treeGrid.expand((project).flatten().collect(Collectors.toList())));
    
            // show option for collapsing
            contextMenu.addItem("Collapse all", VaadinIcons.MINUS, event -> treeGrid.collapse((project).flatten().collect(Collectors.toList())));
        }
    });
    

    最后,你应该得到这样的效果:

    TreeGrid - expand or collapse recursively

        2
  •  0
  •   petey    9 年前

    docs for treegrid ,您可以使用这些方法, collapse 和 expand

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

    同样值得注意的是,有一节展示了 prevent certain items from ever being collapsed