How to right align a button in Java FX toolbar
I am building a UI using Java FX scene builder and I want a button in a toolbar to float towards the right side of the toolbar. I have tried changing the node orientation of the parent(toolbar) and also the button but both seem to be ignored.
Solution 1:
Add a pane with no content which always grows to fit available space between the left aligned tools in the bar and right aligned ones.
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<ToolBar prefHeight="40.0" prefWidth="318.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8">
<Button text="Apples" />
<Button text="Oranges" />
<Pane HBox.hgrow="ALWAYS" />
<Button text="Help" />
</ToolBar>
Solution 2:
(Verified in Scene Builder 11.0.0)
One option: Use two ToolBar containers wrapped with an HBox container. Put the Help button in the right ToolBar. Put the left-aligned buttons in the left toolbar. For the left ToolBar, set the HGrow to ALWAYS
. For the Right ToolBar, set HGrow to NEVER
. For each ToolBar, set all Sizes to USE_COMPUTED_SIZE
.
Here is the relevant fxml:
<HBox VBox.vgrow="NEVER">
<children>
<ToolBar HBox.hgrow="ALWAYS">
<items>
<Button text="Apples" />
<Button text="Oranges" />
</items>
</ToolBar>
<ToolBar HBox.hgrow="NEVER">
<items>
<Button text="Help" />
</items>
</ToolBar>
</children>
</HBox>
This is the hierarchy as displayed in Scene Builder:
This is the display within Scene Builder: