Menu

Parent Previous Next

Menu

The Menu object allows the user to draw a menu in the application and configure expressions to be executed when a node is pressed. The user can also configure the background, border and foreground color, change its thickness, and configure a tag in the caption, etc. Please refer to the object properties at the end of this page.



To create a new Menu in the Graphics Document:


1.   Click the "Menu" button in the Ribbon.


2.   Place the mouse pointer where you want to create the Menu.


3.   Click to create the new Menu.


graphic



Properties:


Open the properties window and locate the configuration area as you can see below.


Use the buttons to "Add new node" or "Remove selected node" to edit the Menu.


graphic


Please refer to the image above for the next tips:


1.   In order to create a child to the Help item, select Help and then click "Add new node".


graphic


This will create a child called "newItem". Now, double-click the node "newItem" and rename the new node to "About".


               graphic


2.   If you want to create a menu item between Menu and Monitor, as in the image above, first deselect any items previously selected. When you click "Add new node", no nodes can be selected or the new item will be created as a child.


graphic


New node "Edit" was created. By default, it is created in the last position of the Menu, but now we can drag it to the location we want to display it in.


.     Hold the Shift key, select Monitor item and drag it to an empty area below the Edit item.


.     Monitor will now be the last item.


.     Hold the Shift key, select Help item and drag it to an empty area below the Monitor item.


.     Help will now be the last item.


graphic

After creating the Menu above in the properties window, the design will show the Menu object as follows:


graphic



Example 1: Opening a window when clicking a Menu item.


.     Create a new Graphic called Main.

.     Insert a Menu object.

.     Configure it with the nodes used in the Properties Window section above in this document.


graphic


graphic



.     Select the configuration tab in the properties window and select the Temperatures item.

.     Write the following code in the expression field:




.      Click OK, it will look like this.




.     Create a new Graphic called MonitorTemperatures.


            graphic



.     Run the Application (F5) and see the results.




.     Open the Main screen, click in the Menu Monitor item (1), select Temperatures (2). The expression will execute and open the graphic "MonitorTemperatures" as expected.




Example 2: Shutting down the application when clicking a Menu item.


.     Create a new Graphic called Main.

.     Insert a Menu object.

.     Create a new Item to Exit the application as shown below.


            graphic


.     Configure the Exit item with the following expression:


            


.     Click OK, the configuration must look like the following:


            


.     Run the Application (F5) and see the results.


            


.     When you click Menu -> Exit, the application will shut down.



Property List:


Info

.     Name

.     Size

.     Location

.     ZIndex

.     Draggable


Configuration

.     MenuConfig

.     Text Font

.     Menu Orientation

.     Is Enabled

.     Is Visible

.     ToolTip


Functions

.     .FontColor


Brushes

   Foreground

.     Background

.     Selected


Security

.     Can Do Action