menuBar Box{ font = "Arial", children = [
fileMenu,
otherMenu,
helpMenu ]};
handler MyHandler type RUIhandler{initialUI =[ui], onConstructionFunction = start}
ui Box{columns = 1, margin = 12, background = "#eeeeee",
children =[ menubar,
new Box{ borderStyle = "solid", borderColor = "orange", borderTopWidth = 25,
padding = 11, children =[changeTextBox]}
]};
fileMenuItems menuItem[] =[
new MenuItem{item = "Clear", itemType = MenuBehaviors.simpleText, itemAction = menuAction},
new MenuItem{item = "Type", itemType = MenuBehaviors.simpleText, itemAction = menuAction}];
fileMenu Menu{menubehaviors ::= MenuBehaviors.BasicMenu, title = "File",
options = fileMenuItems, onMenuOpen = closeMenu};
Supported properties and functions are described in “Widget properties and functions.”
import com.ibm.egl.rui.widgets.Menu;
import com.ibm.egl.rui.widgets.MenuBehaviors;
import com.ibm.egl.rui.widgets.MenuItem;
Please note that you must declare a set of menu items before declaring the menu in which the items are displayed. We explain menu development with this ordering in mind.
new MenuItem{item =["Special", [myTimeItem, myReadOnlyItem]],
itemType= MenuBehaviors.subMenu }];
All those functions are available in the Rich UI library MenuBehaviors.
Delegate
MenuItemType(newItem any in, itemAction MenuItemSelection, parentMenu Menu in)
returns (any)
end
In general, a Delegate part named MenuItemSelection describes the item-action function, as noted later.
Delegate MenuItemSelection(parentMenu Menu, item any in) end
function menuAction(parentMenu Menu, item any in)
if(parentMenu == fileMenu)
case(item as string)
when("Clear")
;
otherwise
;
end
else
if(parentMenu == helpMenu)
;
else
;
end
end
end
A Delegate part named MenuBehavior describes the characteristics of the function being referenced. We describe the Delegate part later.
In the menu declaration, list the behaviors property before the other properties.
function closeMenu(keepOpen Menu IN)
if(keepOpen != fileMenu)
fileMenu.hideOptions(false);
end
if(keepOpen != otherMenu)
otherMenu.hideOptions(false);
end
if(keepOpen != helpMenu)
helpMenu.hideOptions(false);
end
end
Delegate
MenuBehavior(menu Menu in, titleBar TextLabel, optionsBox Box, options MenuItem[])
end
for (index int from 1 to optionsbox.children.getSize() by 1)
widget Widget = optionsBox.children[index];
widget.onMouseOver ::= highlight;
widget.onMouseOut ::= removemenuhighlight;
end
You can bring the following example into your workspace to see the relationships described earlier.
package myPkg;
import com.ibm.egl.rui.widgets.Box;
import com.ibm.egl.rui.widgets.CheckBox;
import com.ibm.egl.rui.widgets.HTML;
import com.ibm.egl.rui.widgets.Menu;
import com.ibm.egl.rui.widgets.MenuBehaviors;
import com.ibm.egl.rui.widgets.MenuItem;
import com.ibm.egl.rui.widgets.TextField;
import egl.ui.rui.Event;
handler MyHandler type RUIhandler{initialUI =[ui], onConstructionFunction = start}
{}
ui Box{columns = 1, margin = 12, background = "#eeeeee",
children = [
menubar,
new Box{
borderWidth = 2, borderStyle = "solid", borderColor = "orange",
borderTopWidth = 50, padding = 11,
children =[changeTextBox]}]};
menuBar Box{font = "Arial", children =[fileMenu, otherMenu, helpMenu]};
changeTextBox TextField{text="here"};
readonlyCheck CheckBox{Text = "Read Only", onChange::= setReadOnly};
myTimeItem menuItem{
item = "Time?",
itemType = MenuBehaviors.simpleText,
itemAction = tellTime };
myReadOnlyItem MenuItem {
item = readOnlyCheck,
itemType = MenuBehaviors.widgetItem };
fileMenuItems menuItem[] =[
new MenuItem{item = "Clear",
itemType = MenuBehaviors.simpleText, itemAction = menuAction},
new MenuItem{item = "Type",
itemType = MenuBehaviors.simpleText,
itemAction = menuAction} ];
otherMenuItems menuItem[] =[
new MenuItem{item =["Special", [myTimeItem, myReadOnlyItem]],
itemType= MenuBehaviors.subMenu }];
helpItems menuItem[] =[new MenuItem{item = "About",
itemType = MenuBehaviors.simpleText,
itemAction = showHelp} ];
fileMenu Menu{menubehaviors ::= MenuBehaviors.BasicMenu, title = "File",
options = fileMenuItems, onMenuOpen = closeMenu};
helpMenu Menu{menubehaviors ::= MenuBehaviors.BasicMenu, title = "Help",
options = helpItems, onMenuOpen = closeMenu};
otherMenu Menu{menubehaviors ::= MenuBehaviors.BasicMenu, title = "Other",
options = otherMenuItems, onMenuOpen = closeMenu};
helpArea HTML{onClick ::= hideHelp, position = "absolute", x = 70, y = 60,
backgroundColor = "lightyellow", width = 400, padding = 11,
borderWidth = 3, borderStyle = "solid", height = 50,
text = "Helpful detail is here. <p>Click this box to continue working.</p>"};
function start()
end
function tellTime(parentMenu Menu, item any in)
changeTextBox.text = dateTimeLib.currentTime();
end
function menuAction(parentMenu Menu, item any in)
if(parentMenu == fileMenu)
case(item as string)
when("Clear")
changeTextBox.text = "";
otherwise
changeTextBox.select();
end
else
if(parentMenu == helpMenu)
;
else
; // parentMenu == widgetMenu
end
end
end
function setReadOnly(e Event in)
changeTextBox.readOnly = !(changeTextBox.readOnly);
end
function closeMenu(keepOpen Menu in)
if(keepOpen != fileMenu)
fileMenu.hideOptions(false);
end
if(keepOpen != otherMenu)
otherMenu.hideOptions(false);
end
if(keepOpen != helpMenu)
helpMenu.hideOptions(false);
end
end
function showHelp(parentMenu Menu, item any in)
document.body.appendChild(helparea);
end
function hideHelp(e Event in)
document.body.removeChild(helparea);
end
end