ReadInput01

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 "Project -> Project Manager" from the menu, click "New" and type "Read Input 01" as the project-name, finally click "OK".

Now we need to choose the folder for this project.
Either choose "File -> Mount Filesystem..." from the menu and choose Local Directory or right-click on Filesystems and then choose Mount -> Local Directory in the left-most column in the window.

Please note! When ever you are creating an application you should go through these two steps: Create a project and mount a folder for the project.

In the figure to the left you can see that I created a folder called "ReadInput01" on my D: drive (you are off course using your network drive...).

Now we are going to create a form that are going to hold all the graphical objects for our program

Right-click on the folder you just mounted in the filesystems column and choose "New -> JFrame form"

Type "InputForm" as the name for the form. To follow the standards of a Java-program the name of the form must start with an upper case character. When we're building a form in NetBeans we're actually creating the class that will act as "blueprint" for the form (window) when we run the program.

All class-names in Java should start with an upper case character!

Now a lot of things changed in the window. In the left column a form element is attached to the foldername. In the middle column two tabs are created - the one with the title "InputForm [Form]" is chosen. Finally in the right column a node (InputForm) is applied. Your window should look something like this:

If you do not see the three elements in the right column (Palette, Inspector and Properties) 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.
Choose "Layouts" in the Palette section (in the right column of your NetBeans window).
Select the "AbsolutLayout" icon and click on your form to add this selection to it.
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.

Now you are to add a label:
Choose "Swing" in the Palette section and 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 make sure the label is selected (if not then simply click on the label) and locate the field "Text" in the "Properties of inputLbl[JLabel]" section.
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).

Now add a text field:
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 value of the field "Text" in the "Properties..." section. Resize the text field.

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 in the label if you're having trouble finding the empty ("invisible") label...

Finally we'll add 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 execute (F6) the application. We only 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.
You are now looking at the code-editor for your form.

NetBeans has automatically created the skeleton of a method (actionBtnActinPerformed) 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!