Step 4 Create A New Menu Item

Now that you have a window, create a new menu item that allows the user to open this window. To do this, find and open the file using the Project Explorer.

When you open this class, you can see that this is not an empty class but a source generated by the archetype. The init method of this class will run when the system is started (more precisely, when the application server loads your application). It’s a good idea to do some resource-intensive tasks here and upload the caches that will not change when the program is running. As a result of this, the first page will be displayed very quickly when the user opens the application because all the necessary data will be in the server’s memory.

The class contains dedicated caches used by the framework. It performs various tasks, e.g. keeps track of pages and menu items, to name a few. Pages and menu items are stored in these caches. Also, individual items are given a unique ID. Such tasks can be performed by using a method for each one. The framework handles these methods and automatically executes them if need be.

Register your page to the framework

You can do this by looking for the createPages method in the class. In the method, you will find a row that has been generated by the archetype. This row is responsible for registering the main page to the framework. Create a similar row to the one registering the recently completed page. Specify welcomePage as the unique ID for the registered page. Later on, you can reference the page as follows:

This code snippet registers your page to the framework. The first parameter is a text value that is the unique page ID in the application. Specify any value here. The only constraint is that this value has to be a unique one throughout the whole application.

The second parameter is the UI class you use to display the page. In this case, since we have only one UI class in this application, we use this.

The third parameter is the class that creates the page. In this example, this is the class we created in the first paragraph.

Create two menu items in the application

To create the menu items, look for the createMenus method. You will see that this method is not empty as the archetype has already generated a dummy menu structure. The first statement in the method creates the mainMenu. This represents our menu structure. Individual menu items come after this, all assigned to the mainMenu.

In this example we don’t need menu items. Delete all automatically generated menu items except for the first row and then add your own menu items.

Set the Home menu

Create a menu item that allows the user to navigate back to the main page. To do this, enter the following:

This places a menu item into the specified menu. (In this case, into the main menu.) The first parameter is a text value that determines which menu item should be placed into which menu. This value can be a previously created menu ID. If there is no previously created menu in the framework, the method results in an error.

The second parameter is the menu item ID. This can be any text value, but it has to be unique throughout the whole menu.

The third parameter is an icon that appears before the menu item. It is important to note the icons are only displayed on the first level of the menu structure. This parameter is ignored on every other level in the menu structure. If you don’t want to add an icon to the menu item, specify a null value.

The third parameter is the menu text. You can specify any text here.

The fourth parameter determines how the menu item should behave when clicked on. You have two options here: OPEN_PAGE or CUSTOM_EVENT. In case of the OPEN_PAGE, the framework automatically opens the specified page when clicking on the menu item, whereas in the other case you can add an event handler to the menu item. In this example we want to achieve that the page opens automatically, so here we specify OPEN_PAGE.

In the last parameter, you have to specify the pageId (unique page ID) of the page that opens automatically when opening the menu item. If you don’t choose the OPEN_PAGE option, this parameter is ignored. In this example, we want to open the main page when clicking on the menu item, so we specify the main page’s pageId.

Prepare the new menu item for your page

Create a new menu item as described above. This menu item opens the recently created page. You can do this with the following code: