How to make a dropdown menu in MockingBot?

An ongoing series of MockingBot tutorials.

Considering the dropdown menu could be used in multiple screens, it’s better to make use of the inheritance feature of “master” in MockingBot.

So we are gonna use “master” to create a dropdown menu in the tutorial.

1. Create a new master template.
2. Create two screens in the master template editing area: screen 1 should be set to “menu-icon”, drag the “Hamburger” icon from the icon panel on the left; screen 2 is set to “dropdown”, drag icons such as “Settings”, “Likes”, “Messages” or other components from the component panel to fill the contents of the page.
3. Add links between screens: “Hamburger” in screen 1 should be linked to screen 2; “Hamburger” in the screen 2 should be linked to screen 1. Besides, make sure that the template size should be the desired size of the dropdown menu;
4. After saving successfully, return to the workspace.
5. Drag the master template into your project, click “Launch” to preview the dropdown menu.

You can also watch the video tutorial for detail.