What are the steps to configure the app level hamburger drawer
4 Likes
Hamburger drawer is a menu icon
that contains the collection of different menus such as change Password, sign out, Terms and Conditions, FAQ(s), my profile, and others. Apart from common hamburger menu items, you can add other menu items to hamburger drawer based on the workflow of the business mobile app.
Hamburger drawer is a very common feature in the mobile app. In most of the mobile apps, three bars/lines
are used as the icon of hamburger drawer. Major advantages to use hamburger drawer are as follows:
- It provides direct access to frequently used functionalities such as Home, FAQ, My profile, Sign out, and others.
- It works as single container to several small functionalities, which are hard to access if they are placed standalone
- It makes the navigation clearer and more linear.
- It is well recognized by its commonest used three lines/bars icon.
When you create a project to design a mobile app by using the vDesigner application, a Hamburger drawer with the DRAWER_HOME title/name is created by default. When Drawer_Home hamburger is created, it contains two hamburger menus, Change Password and Sign Out by default. Apart from these hamburger menus, you can add other menus to the hamburger drawer.
If you want to display the newly created hamburger drawer on specific page, you need to open the Dataon Full Form Definition dialog box (property sheet) of the respective page. In the property sheet of the page, you need to locate the Drawer Name box. In the Drawer Name box, you can enter the name drawer as follow:
DRAWER_<>
After you enter the name of hamburger drawer on the property sheet of the page, you need to click Save. Later, when you create a hamburger drawer, the newly created hamburger drawer will be displayed on that page, in which you have entered the name of hamburger drawer.
On the hamburger menu, you can apply the appropriate task to impart the functionality to the respective menu.
You can add the hamburger menu to the drawer as follows:
- In the vDesigner application, locate the left navigation pane.
- In the left navigation pane, click the Modules link , the Modules link expands.
- Under **Modules , click the Hamburger Drawer link, the Hamburger Drawer dialog box opens.
- In the Hamburger Drawer dialog box, click the Add Row link, a new row of different boxes appears.
- In the respective boxes, enter values as follows:
- After you enter the details of hamburger menu item as described in the last table, click the Next link , the Drag and Drop to change Sort Sequence screen displays the details of recently added hamburger menu items.
- If you ensure that the details of added hamburger menus are correct, click Save, the hamburger drawer is successfully configured for the mobile app.
5 Likes
Thanks for answering but Iām searching it for vflow not vdesigner
2 Likes
To configure a Hamburger in vFlow, follow the below steps:
-
Go to Custom pages and add/ edit Header Entity.
-
Hamburger works with Header Template 1 so select Template 1 in the Basic properties.
-
Navigate to the Configuration Section and add Hamburger properties.
-
Select the Visible Hamburger checkbox.
-
Mention the Type, Label and URL for the hamburger
32 Likes
Thanks @ShraddhaDhoke for answer
2 Likes