Featured Post

This example uses the same controller as in a previous post but adds a use case to support email validation. A Commons Validator object is ...

Saturday, March 7, 2015

Combining Right Aligned and Left Aligned Buttons in JavaFX

This is a quick post on the JavaFX principle of "when in doubt, wrap". You don't want your FXML drowning in unneeded containers, but sometimes a Wrap In can get the display you need with a single mouse click. This example shows how to build a toolbar where some Buttons are left aligned and others are right aligned.

This screen shot shows the Maven POM (Bulk) Updater app. Above the TableView, there are 3 Buttons. Two (select and de-select) are aligned to the left. The third, lock, is aligned to the right.

A Toolbar with Buttons Aligned both Left and Right

The subform above the TableView is structured as follows. Each set of Buttons is wrapped in an HBox. In the case of the blue check (select) and the unchecked box (de-select) to the left, the HBox retains its default alignment of TOP_LEFT. For the unlock icon to the right, the HBox's alignment is set to TOP_RIGHT in SceneBuilder.
Here is the hierarchy and settings for the rightmost HBox.

Rightmost HBox has Alignment Set to TOP_RIGHT

Both HBoxes are added to a two-column GridPane.

In my opening paragraph, I suggested "when in doubt, wrap". I was trying to get the right Button to stick to the right by manipulating the enclosing GridPane and the Button itself. However, when I simply wrapped the Button in an HBox (as with the left buttons), and flipped a setting my layout worked.