Use the Tree Genie

Use the Tree Library Control on a page when you want to be able to view hierarchical data such as a menu.

Note: Configure the Equipment Tree Library Control to view equipment in your system.

The example below illustrates how the Genie can be used to view menu items within your system for a particular page. A basic example, the implementation of the tree Genie can also be used to display dynamic generated menu items using Cicode.

Example 1: Displaying Pre-configured Menu Items

Using the Example project, if you would like to display the menu items for the "_plant" page, complete the following:

1. From the Object toolbox select the Paste Genie icon.

2. In the Paste Genie window, select the lib_controls library

3. Select the Tree Genie. The Tree Genie is pasted onto the graphics page.

4. In the Tree Genie property dialog, configure the fields according to the table below. Click OK to save the changes.

When you compile and then run the project, the tree (menu) will look like the following in the runtime environment.

Example 2: Displaying Dynamic Menu Items

This is the more versatile usage of the menu tree where you can create an in-memory menu hierarchy and populate it with your own data, and use the Tree control to display it on the screen. The EquipTree Genie is an example of such usage.

Using the Cicode sample below, open the Cicode Editor and create a callback function.

Example: 'Mytree' initialization callback function.

INT FUNCTION MyTreeInitialize(STRING sTreeName)

// get the menu name for my instance of tree control

STRING sMenu = LibTree_GetProperty(sTreeName, "Menu");

// create a in-memory menu hierarchy

INT hMenu = MenuGetPageNode(sMenu, 1);

INT hNode;

// populate the menu hierarchy (only once)

IF (hMenu > -1) AND (MenuGetFirstChild(hMenu) < 0) THEN

// add level 1 item

hNode = MenuNodeAddChild(hMenu, "Item 1", "");

// add level 2 (sub) items

MenuNodeAddChild(hNode, "Sub-item 1", "");

MenuNodeAddChild(hNode, "Sub-item 2", "");

// add level 1 item

hNode = MenuNodeAddChild(hMenu, "Item 2", "");

// add level 2 (sub) items

MenuNodeAddChild(hNode, "Sub-item 1", "");

MenuNodeAddChild(hNode, "Sub-item 2", "");

// add level 1 item

MenuNodeAddChild(hMenu, "Item 3", "");

END

// return TRUE (1) to signal initialization completes

RETURN 1;

END

As in example 1, paste the Tree Genie onto a graphics page.

In the Tree Genie property dialog configure the following fields:

Assign the name of the in-memory menu hierarchy to the Menu name field of the Genie by assigning this name to the "Menu (Page) Name" field of the Tree Genie at configuration time.

Click OK to save the changes and save the page.

Compile and then run the project. At runtime the tree (menu) will look like the following:

See Also

Use the Library Controls