Directory

Vaadin TreeTable

A table implementation that supports displaying hierarchical structures

View larger

Close

The TreeTable is an extended Table component that can show hierarchical structures in its first column. Users can show or hide children from a small icon before the actual column value in the first column.

The TreeTable is designed to scale well with large number of rows similar to Table component in the core Vaadin. Only visible rows and some "cache rows" are loaded to the client side. With the Collapsible container extension developer can build the data accessing so that it does not consume too much memory on the server side either.

TreeTable has been integrated into Vaadin 6.7 and this add-on will not receive any further updates. All changes will be made to the Vaadin Framework only.

Sample code

        TreeTable tr = new TreeTable("Simple test with builtin container");
        // populate table
        tr.addContainerProperty("Foo", String.class, "foo");
        tr.addContainerProperty("Bar", String.class, "bar");
        Object addItem = tr.addItem();
        tr.getContainerProperty(addItem, "Foo").setValue("First");
        Object addItem2 = tr.addItem();
        tr.getContainerProperty(addItem2, "Foo").setValue("Second");
        Object addItem3 = tr.addItem();
        tr.getContainerProperty(addItem3, "Foo").setValue("Third");

        // build hierarchy
        tr.setParent(addItem3, addItem2);
        tr.setParent(addItem2, addItem);

        // flag to last item to be leaf
        tr.setChildrenAllowed(addItem3, false);

        // reserve excess space for the "treecolumn"
        tr.setWidth("100%");
        tr.setColumnExpandRatio("Foo", 1);

Links

• Source Code
• Demo: WorkLog app with one component
• Demo: ImageBrowser lists directory on server containing images
• Author Homepage
• Issue Tracker

Compatibility