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.

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, make sure that "General" is selected in Categories and "Java Application" is selected in Projects (this is the normal situation). 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 or external 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 - click "Finish" to let NetBeans create the Java source file for you..

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, Inspector and so on) you can make them visible through "Window" from the menu.

Now we'll check 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 -> Free Design" (Free Design should be selected (written in bold) already as it is the default). You're welcome to experiment with some of the other layout possibilities, but Free Design is the one we'll be using for now because it's the most flexible and easy for most 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 "Change variable name ...".
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.
         Also remember that you can always select a component in the Inspector.

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 yellow 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. Remember in the beginning that we unchecked the "Create Main Class"? One of the consequences is that NetBeans doesn't know which class is holding the main-method (used by the JVM).

Normally when we create an application we'll start by creating the main-class and then NetBeans will know!

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

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

Right-click on the button, actionBtn in the Inspector (this is normally the quickest way to make sure that the wanted component is selected - but you can also select the components in the GUI-editor). Select Events -> Action -> actionPerformed in the menu.
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 input text field should then be cleared
• The output-label should be made to 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 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