How to right align a button in Java FX toolbar

java javafx java-8 javafx-8 scenebuilder

26,743

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.

tool

<?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:

26,743

Japheth Ongeri - inkalimeva

I am a developer of web applications, covering both the client-server side. I use Java and PHP for the back-end and HTML5, JavaScript and CSS3 for the front-end. I also create mobile clients using Android.

Updated on August 25, 2021

Comments

Japheth Ongeri - inkalimeva over 2 years

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.
- Japheth Ongeri - inkalimeva almost 10 years
  
  Why the down vote!? It would really help if you left the reason for your down vote in a comment. I've articulated my problem pretty clearly and succinctly. Is it not a valid question? Or do you want screenshots of me ticking the node orientation check-box :-)
- jewelsea almost 10 years
  
  Your original question asked how to left align in a toolbar, which is what happens by default, so it pointless until it was edited. Node Orientation is a different concept than alignment, so mixing the two in the question was confusing to me without further context, code or graphics (not of checking the check box, but of what the desired toolbar would look like and what your current code generated).
Japheth Ongeri - inkalimeva almost 10 years

Thanks I was expecting some property of the nodes involved but if adding another node gets the desired result then it's fine too.
Robin Jonsson almost 8 years

I'm guessing this doesn't work in FX8? HBox.hgrow isn't applicable to the Pane in my code. It's not recognized from the namespace, and doesnt really do anything
Robin Jonsson almost 8 years

@jewelsea Have you had any luck using this in JavaFX8? Cus i can't get it to work.... Seems like ToolBar doesn't inherit from HBox anymore?
jewelsea almost 8 years

@Robin it works fine for me in Java 8. I loaded the FXML from the answer up into the latest SceneBuilder, which I downloaded from gluon and runs on 1.8.0_65-b17. The toolbar displayed exactly as the screenshot provided in this answer.
Robin Jonsson almost 8 years

@jewelsea That's the strangest.... oh well it works for me now too. Not sure what the problem was, i swear i copy pasted the solution to test out. Thanks for the help anyway!
Maxim almost 8 years

@RobinJonsson I think your problem was related to missing <?import javafx.scene.layout.HBox?> directive. Seems like in this case the Scene Builder just ignore HBox.hgrow="ALWAYS" attribute and doesn't show warning or error.
sbsatter almost 7 years

simple, yet elegant. @jewelsea, if you know of any layout guides for the inexperienced, please kindly share!
jewelsea over 6 years

@sbs for some info on JavaFX layout try this: JavaFX2.0 Layout: A Class Tour by Amy Fowler. Of course also see the Oracle doc: Working With Layouts in JavaFX. Also try this layout bounds demo.
Gary almost 6 years

This works well for me, but for some reason SceneBuilder insists on overwriting <Pane HBox.hgrow="ALWAYS" /> with <Pane />.
kleopatra almost 5 years

please write real English - ur or u aren't existing words ;) And no, using a stackpane here is not a good option, actually a stackpane rarely is the appropriate layout
kleopatra over 4 years

Unrelated: please learn java naming conventions and stick to them.