Change your Application background in Scene Builder || JavaFX FXML Tutorial

It's a good idea to change your JavaFX FXML application's background to enhance the interactivity of your application with the users and your application also looks good as well as professional.

You can change your application background in two different ways first is, you can change your application's background color and second is you can change your background with a good and perfect image which can be your application's logo or any other.

This tutorial is a complete guide to change your JavaFX FXML application's background with an image in scene builder.

There are some steps to follow

• Copy your image which you want as your applications' background to source folder in NetBeans or any other ide which you are using by right-clicking on the source folder as shown in the screenshot. But make sure your image has extension .JPEG.

• Now make a new CSS file by right-clicking on the source folder and give it some name, I have given it name background but you can give any of your own choices.

• Paste the code given below in your CSS file you have created and save this file. Write your image name in url with extension in your code in my case my background image name is itachay, So I have written in url section itechay.jpg but you have to use your image name with extension.

.bodybg{
-fx-background-image: url('itachay.jpg');
-fx-background-size: 100% 100%;
}

• Now go to scene builder and select pane you want to change the background. I have selected the main anchor pane but you can select any pane and change its background.

• Go to the properties section and select the CSS Stylesheet you have created in step 2.

• Now select Style class just as.

Its time to run your application and your background have been changed in a professional manner.

Now my application looks like