GUI Applications in NetBeans: JFrame, JPanel, JTable and JOptionPane

Hello students, welcome to Kwickprep. Can you build a real window app, with buttons and boxes, without drawing it in code? Yes, NetBeans lets you drag and drop it. Today we build a simple interest calculator, step by step.

First, two terms. GUI stands for Graphical User Interface, which means a screen with windows, buttons and boxes. Users click and type in it instead of typing commands. Java builds these screens with a set of classes called Swing, from the package javax dot swing. NetBeans is an IDE, an app for writing programs, and it lets us design a GUI by drag and drop.

Here are the steps to create a form in NetBeans. Open the File menu and choose New Project. Pick Java with Ant, then Java Application, and give the project a name. Right click the source package. Choose New, then JFrame Form. Name the form, for example, InterestForm. The design view opens, with an empty frame ready for controls.

A JFrame is the main window of your application, with a title bar and close button. In Design view, you drag controls from the Palette onto the frame. The Properties window lets you change each control's text, font and colour. Source view shows the Java code, where you write what should happen. NetBeans writes the layout code for you, in grey areas you should not edit.

Now let us add controls from the Swing Controls section of the Palette. A Label, the JLabel class, shows fixed text like Principal. A Text Field, the JTextField class, is a box where the user types one line. A Button, the JButton class, is clicked to make something happen. A Text Area, the JTextArea class, holds many lines of text.

Here is the form we will build. Labels show Principal, Rate and Time, and they keep their default names. Text field txtP takes the principal amount. Text fields txtR and txtT take the rate and the time. The button btnCalc shows the text Calculate. Text field txtSI shows the answer.

Each control has two different things, its text and its variable name. To change what the user sees, right click the control and choose Edit Text. To change the name used in code, right click and choose Change Variable Name. Use short prefixes, like txt for text fields, lbl for labels and btn for buttons. Java is case sensitive, so the name in your code must match exactly.

Now three more classes. A JPanel is a container, which means a component that holds other components. Think of it as a box inside the window. You can give a panel its own border and background colour, like a titled box saying Loan details. When you move the panel, everything inside it moves too.

JOptionPane shows small pop up dialog boxes, and it needs this import at the top. Show message dialog displays a message with an OK button. The word this means the box appears over the current form. Show input dialog asks a question and returns what the user types, as a String. Here the user's name is stored in n.

A JTable shows data in rows and columns, like a marks register. Drag a Table from the Palette, and name it tbl. In the Properties window, the model property sets the column titles, like Name and Marks. In code, we get its model, and add row adds one row of values. This needs import javax dot swing dot table dot DefaultTableModel. Here we add Riya with ninety one, and Aman with eighty four.

Now the most important part, making the button work. An event is an action by the user, like a click. Double click the Calculate button in Design view. NetBeans creates a method called btnCalc Action Performed, and opens it in Source view. Whatever code you write inside this method runs every time the button is clicked.

Inside the method, we read and compute. Get text returns what the user typed, always as a String. Double dot parse double converts that String into a number. We do this for principal, rate and time. Simple interest is p into r into t, divided by one hundred. Set text shows the answer, and adding it to an empty string turns the number into text.

Pause and predict. The user types ten thousand as principal, eight as rate, and two as time, then clicks Calculate. What shows in txtSI? Ten thousand into eight into two, divided by one hundred, is one thousand six hundred. It shows one six zero zero point zero, because si is a double.

What if the user types letters, or leaves the box empty? Parse double then throws a NumberFormatException, and the calculation fails. We place the reading inside try, and catch that exception. The catch block uses JOptionPane to show, Enter a number. Press Shift plus F6 to run the form and test it.

Let us revise. In NetBeans, New, then JFrame Form creates a window. We drag labels, text fields and buttons from the Palette. A JPanel groups controls, and a JTable shows rows and columns. JOptionPane shows pop up messages and input boxes. Double click a button to write its Action Performed code, using get text, parse and set text. Build this interest calculator yourself, then add a Clear button.