Although Vaadin ContextMenu was published as a separate add-on in Directory, we tend to consider it as a feature of the recent 7.6 release. The latest minor release added essential hooks that make it simple to catch raw “contextmenu” events and build components that take the advantage of them.
As an add-on, we can be more agile developing ContextMenu further during its early life, but still share it for you to take the full advantage of it. To start using it, just add the following dependency to your project and re-compile your widgetset.
<dependency> <groupId>com.vaadin.addon</groupId> <artifactId>vaadin-context-menu</artifactId> <version>CHECK THE LATEST VERSION FROM vaadin.com/directory</version> </dependency>
As the first version of the add-on was based on, or at least highly inspired by, Peter Lehto’s popular ContextMenu add-don, it is already pretty complete. Features include:
-
Dynamic, hierarchical context menus
-
Icon support
-
Check/uncheck menu items
-
Keyboard navigation
-
Special item and property support for Grid, Table and TreeTable
Manual and JavaDocs are not yet available, but the API mimics the MenuBar component in Vaadin and it is pretty self-documenting. Below you can see a simple usage example with three different kind of menu items:
// Create a context menu for 'someComponent'
ContextMenu menu = new ContextMenu(someComponent, true);
// Basic menu item
final MenuItem basic = menu.addItem("Basic Item", e -> {
Notification.show("Action!");
});
basic.setIcon(FontAwesome.AUTOMOBILE);
// Checkable item
final MenuItem checkable = menu.addItem("Checkable", e -> {
Notification.show("checked: " + e.isChecked());
});
checkable.setIcon(FontAwesome.ANCHOR);
checkable.setCheckable(true);
checkable.setChecked(true);
// Disabled item
final MenuItem disabled = menu.addItem("Disabled", e -> {
Notification.show("disabled");
});
disabled.setEnabled(false);
disabled.setIcon(FontAwesome.AMBULANCE);
The add-on works with virtually any Vaadin components. It can even be hooked to third party add-ons pretty easily. With simple components, there is nothing special you need to do and in more complex cases you can programmatically ask ContextMenu to be shown in a specific location. See for example this code example, where we open a ContextMenu on top of a Leaflet based Map component and use the real location information in the menu action.
We hope you find it useful and post bug reports and enhancement requests (and pull requests!) to the add-on’s Github page.