In this tutorial, you will learn how to use Java Swing checkboxes with the NetBeans IDE. This Java application will display some foods along with their prices. The user is asked to select the food they want to buy. When selecting the foods, the bill amount of the selected foods will be displayed as shown in the following figure:
Figure 1
I am using NetBeans IDE to create a Java application. To create this app, follow the steps below:
-
Start NetBeans, select File->New Project option.
-
The Choose Project dialog opens. Since we want to create a Java desktop application, select the “Java” option in the Categories panel and the “Java Application” option in the Projects panel. Select the Next button to go further. The next dialog will ask for the name of the Java application and the location on disk where we want to create the application. Let’s name this Java application, “checkBoxDemoApp” and let the location be the default location, as shown in the following figure.
Figure 2
-
Click the Finish button to create the application. The NetBeans IDE will automatically create a Java class file by name, CheckBoxDemoApp.java with some default code. The Projects window will appear as shown below:
figure 3
To create a GUI (graphical user interface), we will use the Java Swing toolkit. To work with the Java Swing toolkit, you must add a JFrame form to your application. Therefore, right-click the package, check the demoapp box in the Source Packages node in the Projects window, and select the New->JFrame Form option from the context menu that appears. You will be prompted to specify the class name for the new JFrame form. Let’s enter Fast Food as the class name. Keeping the rest of the text boxes in the dialog at their default values, click the Finish button to create a JFrame form.
Figure 4
A Java class file, the FastFood.java file, will be added to the project with some default code. The Projects window will now appear as shown below:
Figure 5
Also, a blank JFrame form will be created and opened in the Editor window with a toolbar containing several buttons. We will mainly work with the following two toolbar buttons:
- Design – This button will allow us to work with GUI components. We can drag the GUI components from the Palette window and drop them on the form
- Fountain – This button will show the source code of the class. We can write Java code for any component, edit, debug code, etc. in this mode
In this app, we’ll need two label components and three checkbox components. Components of three checkboxes will display three foods along with their price. Of the two label components, one will be used to display the title and the second label component will be used to display the bill amount for the selected foods.
Select the JFrame form, that is, the FastFood.java file from the Projects window, and then select the Design toolbar button on the Editor tab. While in Design mode, drag a Label component from the Swing Controls category of the Palette window and drop it on the JFrame form. Repeat the procedure for the second Label component. Similarly, drag a Check Box component from the Spin Controls category and drop it onto the JFrame form. Repeat the procedure for two more checkboxes because we want three checkbox components in this app. To increase the visibility of these GUI components, we need to increase the font size. So select all five components, ie Ctrl-click each component in the JFrame form and select the font property in the Properties window. Select the desired font and size as shown in the following figure:
Figure 6
After increasing the font size, position the five components so that they appear as shown in the following figure:
Image 7
The next step is to change the text of these components. You can change the text of any component in either of the following two ways:
-
Right-click the component on the JFrame form and select the Edit Text option from the context menu that appears. You can overtype the text of the component and then press the enter key
-
Click on the component in the JFrame form and select the text property in the Properties window. Type the desired subject in the text property of the component.
Using any of the above methods, let’s change the text property of the components as follows:
-
Set the text of the first Label component to “Select Food”.
-
Set the text of the first checkbox to “Hamburger $5”
-
Set the text of the second checkbox to “Hot Dog $7”
-
Set the text of the third checkbox to “Pizza $10”
-
Remove the text property of the second Label component, as its text property will be set through Java code. It is through this Label component that we will display the total amount of the invoice for the selected foods.
After setting the text property of all five components, the JFrame form will appear as shown below:
Figure 8
Each of the Java Swing components that we have placed in the JFrame form is assigned a default variable name, such as jLabel1, jLabel2, jCheckBox1, jCheckBox2, etc. We need to assign a meaningful variable name to these components. To assign a variable name to any component, simply right-click on it and choose the Rename Variable option from the context menu that opens. Let’s set the variable name of the first Check Box to jCheckBoxBurger, the second Check Box to jCheckBoxHotDog, and the third Check Box to jCheckBoxPizza. Also, set the variable name of the second label component to jLabelResponse.
We want that whenever any of the checkboxes is checked or unchecked, the invoice amount of the selected checkbox is displayed.
writing code
Currently, we are in Design mode and to write code, we need to switch to Source mode. To switch to Font mode, click the Font toolbar button from the Editor window or simply double-click any Java Swing component in the JFrame form. Double-clicking on the component will take you to Source mode to write code for that component. We’ll start writing code for the jCheckBoxBurger component. So, double click on the jCheckBoxBurger and you’ll get into Source mode. Write the following code:
int invoice amount = 0;
private void jCheckBoxBurgerActionPerformed(java.awt.event.ActionEvent evt) {
if (jCheckBoxBurger.isSelected()) {
invoiceamount=invoiceamount+5;
} the rest {
invoiceamount=invoiceamount-5;
}
jLabelResponse.setText(“Invoice amount is $”+String.valueOf(billAmount));
}
Description of the above code
You define a global integer variable called billAmount and initialize it to 0. The jCheckBoxBurgerActionPerformed method will be called whenever any action is performed on the jCheckBoxBurger, ie whenever it is checked or unchecked. In the jCheckBoxBurgerActionPerformed method, we determine if the checkbox is checked or not. If the checkbox is checked, the integer value 5 is added to the billAmount variable. If the check box is not checked, the value 5 is subtracted from the billAmount variable.
After writing the code for jCheckBoxBurger, we need to write the code for jCheckBoxHotDog. So, from Code mode, we will return to Design mode by clicking the button on the Design toolbar from the Editor window. From Design mode, double-click jCheckBoxHotDog and type the following code in the jCheckBoxHotDogActionPerformed method that is automatically created in Code mode:
private void jCheckBoxHotDogActionPerformed(java.awt.event.ActionEvent evt) {
if (jCheckBoxHotDog.isSelected()) {
invoiceamount=invoiceamount+7;
} the rest {
invoiceamount=invoiceamount-7;
}
jLabelResponse.setText(“Invoice amount is $”+String.valueOf(billAmount));
}
Once again, return to Design mode by clicking the button on the Design toolbar. Double-click jCheckBoxPizza and type the following code in Code mode:
private void jCheckBoxPizzaActionPerformed(java.awt.event.ActionEvent evt) {
if (jCheckBoxPizza.isSelected()) {
invoiceamount=invoiceamount+10;
} the rest {
invoiceamount=invoiceamount-10;
}
jLabelResponse.setText(“Invoice amount is $”+ String.valueOf(billAmount));
}
After writing the code for the three checkboxes, our project is ready to run. You can run the project by choosing any of the following three options:
-
Select the Run Project toolbar button from the toolbar at the top
-
Press the F6 key
-
Select the Run->Run Project option from the menu bar
If you run the project now, you won’t get any output because the main class of the project right now is CheckBoxDemoApp.java and we haven’t written any code in this java file. So first we need to change the main class file. Therefore, right-click the checkBoxDemoApp project in the Projects window and select the Properties option from the context menu that appears. In the Properties dialog box, select the Run category in the Categories panel. In the Main Class text box, you will find the text checkboxdemoapp.CheckBoxDemoApp which confirms that when you run the project, the CheckBoxDemoApp.java file will be executed first. Change the contents of the Main Class text box to checkboxdemoapp.FastFood to indicate that you want the FastFood.java file to be executed first each time the project is run, as shown in the figure below.
Figure 9
You are now ready to run the project. When you run the project, you’ll get the following three foods in the form of checkboxes to select. Select any amount of food and you will get the amount of your bill:
Image 10
You can download the complete project from the following link: http://bmharwani.com/checkBoxDemoApp.zip
