Im Mittelpunkt steht com.extjs.gxt.ui.client.widget.tree.Tree, dem entweder com.extjs.gxt.ui.client.widget.tree.TreeItem-Objekte zugeordnet werden, oder ein komplexeres Modell zugewiesen wird. Mit TreeItem ist schnell ein statischer Baum aufgebaut:
Tree tree = new Tree();
TreeItem rootTreeItem = new TreeItem( „Hauptobjekte“ );
tree.getRootItem().add( rootTreeItem );
rootTreeItem.add( new TreeItem( „Kunden“ ) );
rootTreeItem.add( new TreeItem( „Seminare“ ) );
rootTreeItem.add( new TreeItem( „Referenten“ ) );
rootTreeItem.setExpanded( true );
tree.addListener( Events.OnClick, new Listener<TreeEvent>()
{
@Override public void handleEvent( TreeEvent be )
{
if ( be.getItem().isLeaf() )
Info.display( „Element: „, be.getItem().getText() );
}
} );
contentPanel.add( tree );
Wie bei Swing gibt es ein Root-Icon und darunter liegen die Kinder.
Mit einem Listener lässt sich erfragen, ob der Baum ausgefaltet wird oder ob Blätter ausgewählt wurden. Das Beispiel hört nur auf die Auswahl der Kinder und gibt eine Meldung aus.