Use Netbeans IDE to develop Java Swing applications

 

This will help you to build a simple GUI with back-end functionality. You will learn how to develop a graphical user interface and how to add functionality to the buttons and fields used. A basic understanding of the Java Programming Language is required.

First of all make sure you have the following software installed on your computer: NetBeans IDE 8.1 (download)

Step 1: Creating a project

  1. Open NetBeans
  2. Chose File > New Project.
  3. In the Categories pane, select Java . In the Projects pane, choose Java Application. Click Next.
  4. Type numberAdder in the Project Name field and specify a path, for example, in your home directory, as the project location.
  5. Deselect the Create Main Class checkbox if it is selected and click finish.

 

Step 2: Building the front end by creating a JFrame container

  1. In the Projects window, right-click the numberAdder node and choose New > JFrame Form
  2. In the New JFrame Form dialog box, Enter numberAdderUI as the class name, Enter mynumberadder as the package name.
  3. Click Finish.

Screenshot_2

Step3: Making of the front end by adding components

  1. Go to the Palette window. If you don’t see it, Select Windows > Palette to open the Palette.
  2. Select a JPanel from the Palette and drop it onto the JFrame.
  3. While the JPanel is highlighted, go to the Properties window and click the “…” button next to Border to choose a border style.
  4. In the Border dialog, select Titled Border, type in Number Adder in the Title field and Click ok

Look at the screen shot below and try to add three JLabels, three JTextFields and three JButtons

Screenshot_5

Step 4: Renaming the Components.

  1. Select jLabel1, go to properties window and change the text property to Number 1
  2. Select jLabel2, go to properties window  and change the text property to Number 2
  3. Double-click on jLabel3 and change the text to Result
  4. Double-click on jTextField1 and remove the sample text in the text field. You may have to resize the jTextField1 to its original size. Repeat this step for jTextField2 and jTextField3.
  5. Double-click on jButton1 and rename it Clear
  6. Double-click on jButton2 and rename it Add
  7. Double-click on jButton3 and rename it Exit
  8. Do some other changes in properties and see what will happen.

Your Finished GUI should now look like this:

Screenshot_6

Step 5 : Adding functionality

Making the exit button work

  1. Double click on Exit button. The IDE will open up the Source Code window and the cursor will appear to the place where you should implement the action .

private void jButton1ActionPerformed(java.awt.event.ActionEvent evt) {

// TODO add your handling code here:

}

  1. We are now going to add the code for what we want the Exit Button to do. You will have to type System.exit(0); to the above code, replacing the TODO line

private void jButton3ActionPerformed(java.awt.event.ActionEvent evt) {

System.exit(0);

}

Making the Clear Button Work

  1. Click on the Design tab at the top of your work area to go back to the Form Design
  2. Double Click on the Clear button.

 

private void jButton1ActionPerformed(java.awt.event.ActionEvent evt) {

jTextField1.setText("");

jTextField2.setText("");

jTextField3.setText("");

}

 

Making the Add Button Work

  1. Click on the Design tab at the top of your work area to go back to the Form Design.
  2. Double Click on the Add button.
  3. We are going to add some code to have our Add button work. The finished source code shall look like this:

 

private void jButton2ActionPerformed(java.awt.event.ActionEvent evt) {

// First we define float variables.

float num1, num2, result;

// We have to parse the text to a type float.

num1 = Float.parseFloat(jTextField1.getText());

num2 = Float.parseFloat(jTextField2.getText());

// Now we can perform the addition.

result = num1+num2;

// We will now pass the value of result to jTextField3.

// At the same time, we are going to

// change the value of result from a float to a string.

jTextField3.setText(String.valueOf(result));

}

Our Program is now complete.

  1. Click on Build in the Main Menu and Choose –> Build Main Project.
  2. When the Build output is finished, click on Run in the Main Menu and Choose –> Run Main Project
  3. If you get a window informing you that Project NumberAddition does not have a main class set, then you should select mynumberadder.numberAdderUI as the main class in the same window and click the OK button.
  4. Your created program is now running.

 

Screenshot_7

From the next post I will tell you how to connect NetBeans with  MySql database.

Leave a Reply

Your email address will not be published. Required fields are marked *