The TreeView class represents a tree view control.
// A TreeView shows a hierarchy of TreeViewItem objects. Every tree has
// one root: setRootItem() names it, addItem(item, parent) hangs the rest
// off it. (addItem() with no root set makes that first item the root.)
//
// Every event but keyDown carries the item it concerns as
// event_args.item.
class MyForm extends Form {
tree = null;
root = null;
constructor() {
super("TreeView Example", 100, 100, 360, 400);
this.tree = new TreeView();
this.root = new TreeViewItem("Data Sources");
this.tree.setRootItem(this.root);
for (const name of ["Databases", "Files"]) {
const folder = new TreeViewItem(name);
this.tree.addItem(folder, this.root);
for (const leaf of ["alpha", "beta", "gamma"]) {
this.tree.addItem(new TreeViewItem(`${name}/${leaf}`), folder);
}
}
this.tree.expandItem(this.root);
this.tree.selectionChanged.connect(this, this.onSelectionChanged);
this.tree.itemActivate.connect(this, this.onItemActivate);
this.tree.itemRightClick.connect(this, this.onItemRightClick);
this.tree.itemEndLabelEdit.connect(this, this.onItemEndLabelEdit);
const layout = new BoxLayout(Layout.Vertical);
layout.add(this.tree, 1, Layout.Expand | Layout.All, 8);
this.setLayout(layout);
}
onSelectionChanged(sender, event_args) {
const item = event_args.item;
// getChildCount(false) counts direct children; true -- the
// default -- counts the whole subtree
this.setCaption(`${item.getLabel()}:` +
` ${item.getChildCount(false)} children,` +
` expanded=${item.isExpanded()}`);
}
onItemActivate(sender, event_args) {
// a double-click or Enter
this.tree.toggleItemExpanded(event_args.item);
}
onItemRightClick(sender, event_args) {
// carry the clicked item on the menu item, so the handler does
// not depend on the selection still being where it was
const rename_item = new MenuItem("Rename");
rename_item.tree_item = event_args.item;
rename_item.click.connect(this, this.onRename);
const menu = new Menu();
menu.add(rename_item);
menu.popup(this.tree);
}
onRename(sender, event_args) {
// starts an in-place edit; the result arrives below
this.tree.editItemLabel(sender.tree_item);
}
onItemEndLabelEdit(sender, event_args) {
this.setCaption(`renamed to ${event_args.item.getLabel()}`);
}
}
const form = new MyForm();
form.show();
Application.run();Adds a treeview item, specified by item, to the node specified by parent. If parent isn't specified, then item is added to the root item of the treeview.
Clears the treeview of all items.
Collapses a treeview item, specified by item, so that it no longer shows any children it may have.
Deletes the treeview item, specified by item, from the treeview.
Deselects all items in the treeview.
Deselects a treeview item, specified by item.
This function triggers an event that causes a treeview item, specified by item, to enter into editing mode.
Expands a treeview item, specified by item, so that it shows its children, if they exist.
Returns the number of items in the treeview.
Returns the number of items in the treeview.
Returns the root item of the treeview.
Gets the root item of the treeview.
Returns the selected treeview item, if a treeview item is selected. Otherwise, the function returns null.
Gets the selected treeview item from the treeview. If the treeview doesn't have a selection, the function returns null.
Returns an array of the selected treeview items in the treeview.
Gets an array of the selected treeview items from the treeview.
Scrolls the treeview control to a treeview item, which is specified by item.
Selects a treeview item, specified by item.
Sets the root item of the treeview from the specified item.
Expands or collapses a treeview item, depending on whether it is currently expanded or collapsed. If the treeview item is currently expanded, the function will collapse it. If the treeview item is currently collapsed, the function will expand it.
Selects or deselects a treeview item, depending on whether it is currently selected or deselected. If the treeview item is currently selected, the function will deselect it. If the treeview item is currently deselected, the function will select it.