Contact us Create app

Directory

← Back

tree

Tree component for Vaadin 24, Vaadin 23 and Vaadin 14

Author

Rating

Links

Popularity

1200+

This is Tree component for Vaadin 14, Vaadin 23 and Vaadin 24, the API mimics the Tree API from Vaadin 8 for applicable parts.

Features

Sample code

        Tree<Department> tree = new Tree<>(Department::getName);

        tree.setItems(departmentData.getRootDepartments(),
                departmentData::getChildDepartments);

        tree.setItemIconProvider(item -> getIcon(item));
        tree.setItemIconSrcProvider(item -> getImageIconSrc(item));
        tree.setItemTitleProvider(Department::getManager);

        tree.addExpandListener(event -> message.setValue(
                String.format("Expanded %s item(s)", event.getItems().size())
                        + "\n" + message.getValue()));
        tree.addCollapseListener(event -> message.setValue(
                String.format("Collapsed %s item(s)", event.getItems().size())
                        + "\n" + message.getValue()));

        tree.asSingleSelect().addValueChangeListener(event -> {
            if (event.getValue() != null)
                System.out.println(event.getValue().getName() + " selected");
        });
        tree.setHeightByRows(true);

Compatibility

(Loading compatibility data...)

Last updated: 2024-07-17

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Version 3.3.0

  • Add delegate method for scrollToIndex(int...)
  • Add delegate method for setPartNameGenerator
  • Improve keyboard navigation. Space now toggles expand/collapse, Enter toggles selection
  • Vaadin 24.3 or newer is required
Released
2024-07-17
Maturity
BETA
License
Apache License 2.0

Compatibility

Framework
Vaadin 24.3
Vaadin 24.4
Vaadin 20 in 2.0.0
Vaadin 19 in 2.0.0
Vaadin 18 in 2.0.0
Vaadin 14 in 1.0.0
Vaadin 22 in 2.2.0
Vaadin 21 in 2.2.0
Vaadin 23 in 2.2.0
Vaadin 24+ in 3.0.0
Browser
Firefox
Opera
Safari
Google Chrome
iOS Browser
Android Browser
Microsoft Edge

tree - Vaadin Add-on Directory

Tree component for Vaadin 24, Vaadin 23 and Vaadin 14 tree - Vaadin Add-on Directory
This is Tree component for Vaadin 14, Vaadin 23 and Vaadin 24, the API mimics the Tree API from Vaadin 8 for applicable parts. Features - Supports VaadinIcons or image icons - Single select / multiselect modes - Programmatic focus - Tooltips - Expand/Collapse by toggle icon only: https://github.com/vaadin/flow-components/issues/1091
View on GitHub
Online Demo

tree version 1.0.0
### Version 1.0.0 - First version

tree version 1.1.0
### Version 1.1.0 - Fixed sizing logic

tree version 1.1.1
### Version 1.1.1 - Added TreeGrid focus workaround to focus() method

tree version 2.0.0
### Version 2.0.0 - Support Vaadin 18.0.0 and newer. There was API changes in Vaadin 18 concerning DataView and also setDataProvider type safety on TreeGrid, which needed a new build.

tree version 1.2.0
### 1.2.0 - Add support images as icons

tree version 2.1.0
### Version 2.1.0 - Add support for image icons

tree version 2.2.0
### Version 2.2.0 - Fix issue with missing VaadinIcon's in Vaadin 21. Vaadin 21 or newer required.

tree version 2.2.1
### Version 2.2.1 - Fix regression with images not working

tree version 2.2.2
### Version 2.2.2 - Improve visual look of mixed Icon and Image usage

tree version 1.3.0
### Version 1.3.0 - Control expand/collapse only by toggle icon, see: https://github.com/vaadin/flow-components/issues/1091 - Add addThemeVariants/removeThemeVariants API - Added --tree-icon-height custom CSS property to configure icon height

tree version 1.3.1
### Version 1.3.1 - Fixed removeClassName

tree version 1.4.0
### Version 1.4.0 - Added setHtmlProvider - Fixed css not to break titles

tree version 2.3.0
### Version 2.3.0 - Tested with Vaadin 23 - Control icon size by --lumo-icon-size-m custom property - Added htmlProvider - Fixed removeClassName - Added addThemeVariants / removeThemeVariants - Toggle expand/collapse only with button

tree version 1.4.1
### Version 1.4.1 - Add setSanitize method to disable html sanitation

tree version 2.3.1
### Version 2.3.1 - Add setSanitize method to disable html sanitation

tree version 2.4.0
### Version 2.4.0 - Add DnD API pass through - Propagate theme attribute to tree toggle

tree version 3.0.0
### Version 3.0.0 - Feature set is derived from version 2.4.0, but adopted for Vaadin 24 - Instead of title attribute vaadin-tooltip used for tooltips - setTitleProvider renamed to setTooltipProvider - getTitleProvider renamed to getTooltipProvider - setHeightByRows renamed to setAllRowsVisible

tree version 3.0.1
### Version 3.0.1 - Fixes typo in one of the templates, which broke icon. Thanks @Bruno Rezende

tree version 3.1.0
### Version 3.1.0 - Added passthru of getDataCommunicator API

tree version 2.5.0
### Version 2.5.0 - Add option to select only leaf nodes

tree version 3.2.0
### Version 3.2.0 - Added setSelectOnlyLeafs - Removed use of iron-icon as vaadin-icon now supports images - Requires Vaadin 24.2 or newer

tree version 3.3.0
### Version 3.3.0 - Add delegate method for scrollToIndex(int...) - Add delegate method for setPartNameGenerator - Improve keyboard navigation. Space now toggles expand/collapse, Enter toggles selection - Vaadin 24.3 or newer is required

Online