Justinmind

SUPPORT

Learn how to prototype web and mobile apps

Create your own plugins with Justinmind

In previous tutorials, we talked about how to create code that reads the contents of a .vp file and performs the corresponding action. Here, we’ll show you how to add menu and tool bar options inside Justinmind.

Justinmind prototyping tool was built using an Eclipse Framework technology called RCP (Rich Client Platform). This technology allows you to enhance the application’s functionality, using plugins. In this tutorial, we’ll cover the basics to build simple plugins for Justinmind. However, if you’d like to build more complex things, there’s a lot of information available on Eclipse’s web site about how to develop plugins for RCP applications like Justinmind.

So, let’s get started! First we need to create a new plugin project, as we did in the previous tutorials:

  • Go to File> Project> Other and select ‘Plugin Project’. Give it a name and click ‘Next’.
  • Check the options ‘Generate an activator…’ and ‘This plugin …’ and click ‘Next’. Then select the ‘Hello World Command’ template:

new-plugin-example

  • And then click ‘Finish’.
  • The new project will appear in the project’s folder on the left. Open the src folder and look for the class called SampleHandler inside handlers package. That class is the main entry point to your code. Open it and look for the method ‘Execute’. That it’s the equivalent of the ‘main’ method we had in the previous examples. Add code here just to test the integration.
  • To configure your plugin to be able to work in Justinmind, open the file called ‘MANIFEST.MF’ located inside the META-INF folder. Then, select the tab ‘MANIFEST.MF’ and add this line at the bottom:

Eclipse-RegisterBuddy: com.justinmind.prototyper.api

  • Click ‘Save’. Now your plugin and the API will be able to work together. Find more on this here.
  • Select the tab ‘Dependencies’. Click ‘Add’ and write ‘com.justinmind’. Select the three plug-ins listed and click ‘OK’. Then select File> Save. Now you have a project configured to access all the methods in the API.
  • Open the file named plugin.xml and select the tab ‘extensions’. Then select the ‘Sample Command’ node in the extensions tree (inside org.eclipse.ui.commands branch). There you will be able to define the menu option name that will execute your plug-in inside Justinmind.
  • In order to make your plug-in visible inside Prototyper, you need to set its location within the workbench menu and the toolbar of the application: Open plugin.xml and select the tab ‘extensions’. Select ‘org.eclipse.ui.menus’ node and then ‘menu:org.eclipse.ui.main.menu’. Replace its locationURI with the following text: ‘menu:org.eclipse.ui.workbench.menu?after=additions’.

We highly recommend you name your plug-in to the ‘plugins’ menu already available in Justinmind  so the users of your plug-in know where to find it. So if you want your plug-in to be included inside the ‘Plug-ins’ menu option in Justinmind once the user imports it, then you need to customize the ‘org.eclipse.ui.menus’ Extension this way: Select ‘Sample Menu’ node in the extensions tree and set as id> plugins and as label> Plug-ins just like the screenshot below:

customize-action

You now need to export the plugin out of the SDK. Select the tab ‘overview’ and look for the ‘Export Wizard’ link:

export-plugin

Then select a destination folder to save your plugin and click ‘Finish’. Your plugin will be saved in a folder called ‘plugins’ inside the one you defined as the destination folder.

Now you’re all set to test your plugin in Justinmind. Open Justinmind and select the option ‘Install a plugin’ that you’ll find in the plugins menu. Select the plugin you’ve just exported and restart Justinmind. You should have a new option available within the plugins menu for the plugin you just made.

So that’s all folks! Now it’s time to build your own plugins and share them (or sell them) with other Justinminders around!