I have some buttons inside of a VBox
. I would like to align the last button to the bottom of the VBox. Is there any way to do this?
I've tried this answer but it didn't work.
Here is my code:
<VBox fx:id="presetVBox" prefHeight="580.0" prefWidth="180.0" style="-fx-background-color: white;">
<padding>
<Insets left="10.0" right="10.0"/>
</padding>
<Button fx:id="preset1Button" maxWidth="Infinity" mnemonicParsing="false"
prefWidth="Infinity" text="Load Preset 1">
<VBox.margin>
<Insets top="10.0"/>
</VBox.margin>
</Button>
<Button fx:id="preset2Button" maxWidth="Infinity" mnemonicParsing="false"
prefWidth="Infinity" text="Load Preset 2">
<VBox.margin>
<Insets top="10.0"/>
</VBox.margin>
</Button>
<Button fx:id="savePresetButton" maxWidth="Infinity" mnemonicParsing="false"
prefWidth="500.0" text="Save">
<!-- This button needs to aligned to the bottom of the VBox -->
<VBox.margin>
<Insets top="161.0"/>
</VBox.margin>
</Button>
</VBox>
Add a empty Region
between the button and the child before the last child. If you set the VBox.vgrow
property for this node to ALWAYS
, VBox
resizes it to occupy the remaining space:
<VBox fx:id="presetVBox" prefHeight="580.0" prefWidth="180.0" style="-fx-background-color: white;">
<padding>
<Insets left="10.0" right="10.0"/>
</padding>
...
<Button fx:id="preset2Button" maxWidth="Infinity" mnemonicParsing="false"
prefWidth="Infinity" text="Load Preset 2">
<VBox.margin>
<Insets top="10.0"/>
</VBox.margin>
</Button>
<Region VBox.vgrow="ALWAYS" />
<Button fx:id="savePresetButton" maxWidth="Infinity" mnemonicParsing="false"
prefWidth="500.0" text="Save">
<!-- This button needs to aligned to the bottom of the VBox -->
<VBox.margin>
<Insets top="10.0"/>
</VBox.margin>
</Button>
</VBox>