A few months back I had the pleasure of attending the multidevice presentation by Gerrit Grunwald (@hansolo_). In this presentation he demonstrated how easy it was to port a single JavaFX code base to several devices, including Android, iOS, RasberryPi, and a few more. One of the UI elements he showed on each device was a corner menu; circular icons appearing from the corner of a window. This was visually a great UI component, and Gerrit told me it was part of his Enzo library. The Enzo library is full of such visually appealing JavaFX controls and components, and freely available to everyone who wants to use them, but it is also the case that Enzo mainly exists to support Gerrit in his presentations and demonstrations. And there is a difference between a control intended for public use and one that is a result of a demonstration. So when I asked Gerrit if I could take his control and move it over to JFXtras, he agreed immediately.

The first order of business was to layout stuff in a 90 degree arc. And I could have just copied Gerrit’s code, but as things go in a hobby project I decided that this should be something reusable, so CircularPane was born.

It took some time to get it working correctly; creating a general purpose pane for laying out stuff in a circle dynamically is not as trivial as it seems. But after a few weeks it got to the point where CircularPane was mature enough, a demo was available, and it was unit tested. After that, work could finally start on one of the primary things it was created for: CornerMenu. (Although the fact that a round shaped Android watch will come out soon, may turn out to be a nice coincidence.)

So CornerMenu is exactly what it says: a menu that is located in any of the four corners of a window. The menu can be static, but usually it will show the items when the mouse comes close to the corner, like so:

Because CornerMenu is leaning heavy on CircularPane, it also supports configurable animations. Build-in are “from origin” (which can be seen above) and “over the arc” (below), both are based on the animations defined in CircularPane, but in CornerMenu some transparency and rotation is added.

CornerMenu uses the standard MenuItem class of JavaFX, so starting to use it should be very straight forward. The main difference is that in CornerMenu the graphic of a MenuItem is mandatory, while in regular menu’s only the text is.

	// position a corner menu in the top left corner, that initially is not visible
	CornerMenu cornerMenu = new CornerMenu(CornerMenu.Location.TOP_LEFT, stackPane, false)
		.withAutoShowAndHide(true);

	// add the menu items
	cornerMenu.getItems().addAll(facebookMenuItem, googleMenuItem, skypeMenuItem, twitterMenuItem, windowsMenuItem);

CornerMenu is available in JFXtras-8.0-SNAPSHOT-r2. I’m very curious how it will work out in real world applications, so if anyone uses it, drop a line in the comments below!