JavaFX 2.0 Layouts: VBox

Here is the second tutorial in JavaFX 2.0 Layout series. It's about Vertical Box (VBox) layout. VBox lays out its children in a single vertical column. If the vbox has a border and/or padding set, then the contents will be layed out within those insets.


Follow  these  steps for creating the project or check Getting Started with JavaFX 2.0 in Eclipse IDE:

• Open Eclipse IDE
• Create a new Project and specify name VBoxTest
• Create class with name VBoxMain
• Add jfxrt.jar file 
• Copy the code of our  application below

VBox

Above you can see how the program will look in the end of this tutorial. As you can see it's pretty simple, with only one label and four buttons. Because our goal isn't to create any action or anything like that (for now), but the goal is to understand how VBox layout works. 


Here is the code of our VBox example.


First we create an instance of a VBox. The padding is the top, right, bottom, and left spacing around the region's content in pixels. The amount of horizontal space between each child in the hbox.


Here we create the label and set text. Add a label to VBox and set font bold Amble CN with size 24.


Here we have an example how create a button and add it to VBox, in this case button4. You will need to do this step for all of the buttons. Also here I am adding VBox layout to the Scene, and setting the Scene to primary stage, and showing that primary stage.

Check other tutorials from JavaFX Layout series by clicking on the image above.