Read Input 01

Let's make and compile a simple Java-program using NetBeans to get to know the procedure! We'll make a program that reads input in a textfield and when a button is clicked the input is read and shown as text in the window.

As always the first thing you should do is to make a new folder for your program on your network-drive (h:).
It is possible to create this folder from NetBeans or you can create it now using Explorer.

Start NetBeans (it may take a while...).

The first thing we have to do is to create a project to hold all information of this application.
Choose "File -> New Project" from the menu, click "Next" and type "InputForms" as the project-name.
Make sure that "Project Location" is set to the network folder you want to use for the project.

Remove the checkmark in "Create Main Class" - note that this means that we're only creating a new project. No files will be created yet!

The dialogbox should look something like this (note that I'm using a local drive - you should always use your network drive)

Finally click "Finish".

Now we are going to create a form that are going to hold all the graphical objects for our program.
Choose "File -> New File...".
In the "Categories" select "Java GUI forms", in "File Types" you'll now see a number of different GUI forms - select "JFrame Form"

Click "Next" and type "InputForm01" as the name for the form.

Now a lot of things changed in the window. In the left column the "Inspector" area got content. In the middle column a tab is created with the title "InputForm01". Finally in the right column a palette showing Swing components is applied. Your window should look something like this:

If you do not see the elements (Palette and Inspector) you can make them visible through "Window -> GUI Editing" from the menu.

Now we'll set the layout for the form. The layout determines how the window (or frame) reacts if the size is changed.

In exercises it is normally very important that you remember to set the layout as the very first thing for JFrame's (and JPanel's).

Right-click the JFrame icon in the Inspector and select "Set layout -> AbsoluteLayout".
You're welcome to experiment with some of the other layout possibilities, but AbsoluteLayout is the one we'll be using for now because it's the most easy for simple GUI's.

Adding a label
In the Palette section click on the JLabel icon - click on the form to add the label.
Whenever we add a graphical component to a form it will be given a default name by NetBeans - e.g. jLabel1 (as seen under the JFrame node in the Inspector section). As we add more components these names becomes completely useless as it will be impossible to remember which component has which name. You should get into the habbit of changing the names to something more understandable and easier to remember.
So right-click on the string "jLabel1 [JLabel]" in the Inspector and choose "Rename...".
Type "inputLbl" as the name - note that the first letter is lower-case!! In Java this is standard for user-defined names (except class-names).

To change the text of the label right-click on "inputLbl [JLabel]" and select "Edit Text" - change the value to "Type your input : " (you have to press the Enter key to actually make your change happen). You might have to resize the label (use the mouse-pointer).

Adding a text field
In the Palette click on the JTextField icon and click on the form to add it.
Change the name of the text field to "inputFld". Remove (delete) the text inside the text field and resize it.

Adding a label more
We'll now add a label where the text will change according to what the user types in the text field:
Add a label, change the name to "outputLbl" and remove (delete) the current text. Resize.
Note: You can leave some text (e.g. a space-character) in the label if you're having trouble finding the empty ("invisible") label...

Adding a button
Click on the JButton icon and click on the form to add it.
Change the name to "actionBtn" and change the current text to "Read input".

Resize and move the components as you please.

Your form should look something like the one below (note it does not have to be identical...):

NOTE that I've selected the label outputLbl so you can see it (the blue rectangle).

You can compile (F9) and run (F6) the application.
If you try to run you'll get a error message like:

Click "Ok" to make the InputForm01 the main class of the project.

Adding action
We miss some action when we press the button!

Close the application if you started it so we're back in NetBeans.

Double-click on the button, actionBtn (not in the Inspector - double-click directly on the button ).
You are now looking at the code-editor for your form.

NetBeans has automatically created the skeleton of a method (actionBtnActionPerformed) that will be executed when the button is clicked in the running application.

What we want to happen is:

• The value from the input text field (what the user typed in the text field) should be read
• The text field should then be cleared
• The output-label should now show the value we just read
• The text field should have focus so any new text the user types is entered here

The Java-statements for doing this is shown below

String value = inputFld.getText(); inputFld.setText(""); outputLbl.setText(value); inputFld.requestFocus();

Notice the use of the names we declared for the components (you might imagine how difficult it would be to distinguish between the default names given by NetBeans...)

Also notice that we use a local string (called value) to store the value we get from the text field - then we use it again to set the text of the output label.

Add the code above to the method and compile.
Run you application to make sure everything works as expected!