Tree widget and related types

A Rich UI tree widget defines a set of tree nodes.

The tree itself has two fields:
The following rules relate to the behaviors of either a tree or (as noted later) a tree node:

Other supported fields and functions for Tree and TreeNode are described in the following topics in the EGL Programmer’s Guide: “Rich UI widget fields” and ”Rich UI widget functions.”

Use of a tree requires the following statements:
import org.eclipse.edt.rui.widgets.Tree;
import org.eclipse.edt.rui.widgets.TreeBehaviors;
import org.eclipse.edt.rui.widgets.TreeNode;
import org.eclipse.edt.rui.widgets.TreeTooltip;

TreeNode

The Rich UI tree widget includes a set of tree nodes, each of which is a widget of type TreeNode. Here are the tree-node fields:
  • text is the value displayed for the node.
  • children is a dynamic array that points to the subordinate tree nodes.

TreeToolTip

The tree tooltip is equivalent to the widget described in “Tooltip widget.” However, in this case, the provider function accepts a tree node.

The example in the next section shows use of a tree tooltip.

Example

The example in this section displays the following tree:

Example of tree and the tree tooltip

Here is the code:
package client;

import org.eclipse.edt.rui.widgets.Box;
import org.eclipse.edt.rui.widgets.TextArea;
import org.eclipse.edt.rui.widgets.TextLabel;
import org.eclipse.edt.rui.widgets.Tree;
import org.eclipse.edt.rui.widgets.TreeNode;
import org.eclipse.edt.rui.widgets.TreeNodeBehavior;
import org.eclipse.edt.rui.widgets.TreeTooltip;
import eglx.ui.rui.Event;
import eglx.ui.rui.RUIHandler;

handler MyHandler type RUIhandler {initialUI = [ myBox1 ]}

   myBox1 Box{ backgroundColor = "yellow", padding=8, columns = 1,
               children = [ myTextArea, myTree ] };

   myTextArea TextArea {numRows = 5, numColumns = 50,
               text = " This tree shows 2 children, each with 2 children."}; 
	
   myTreeNodeA TreeNode{backgroundColor = "cyan",text="Child 1", 
                        children =[myTreeNode1, myTreeNode2] };

   myTreeNode1 TreeNode{backgroundColor = "lightblue",text="Gchild 1-1" };
   myTreeNode2 TreeNode{backgroundColor = "lightgreen",text="Gchild 1-2" };

   myTreeNodeB TreeNode{backgroundColor = "orange", text="Child 2", 
           children =[myTreeNode3,
                      new TreeNode{backgroundColor = "burlywood", text = "Gchild 2-2"}] };

   myTreeNode3 TreeNode{backgroundColor = "lightpink", text="Gchild 2-1" };
	
   myBehaviors TreeNodeBehavior[] = [ click, tooltip.setTooltips ];

   myTree Tree{backgroundColor = "lavender", behaviors = myBehaviors, 
               children =[myTreeNodeA, myTreenodeB]};

   tooltip TreeTooltip { provider = showTooltip, tooltip.delay = 1000 };

   function click(node TreeNode in)
      node.span.cursor = "pointer";
      node.onClick ::= handleNodeClick;
      node.onMouseOver ::= showFeedback;
      node.onMouseOut ::= hideFeedback;
   end

   function showTooltip(node TreeNode) returns(Box)
      tooltipText TextLabel { };
      tooltipResponse Box { children = [ tooltipText ] };
      tooltipText.text = "Tooltip for " + node.text;
      return (tooltipResponse);
   end
	
   function showFeedback(e Event in)
      node TreeNode = e.widget;
      color any = node.backgroundColor; 
      node.setAttribute("originalBG", color);
      node.span.backgroundColor = "yellow";
	 end
	
   function hideFeedback(e Event in)
      node TreeNode = e.widget;
		  node.span.backgroundColor = node.getAttribute("originalBG");
   end
	
   function handleNodeClick(e Event in)
      node TreeNode = e.widget;
      if (node.span.color == "red")
			   node.span.color = "black";
         node.span.fontWeight = "normal";
      else
         node.span.color = "red";
         node.span.fontWeight = "bold";
      end
   end
end