Lab1: Introduction to the Java Swing

Most of the codes and activities source: Introduction to Programming Using Java, Sixth Edition

---

Hello World Java Program

Java programs start their execution at the main function which is contained in a class. We will create a very simple main function that prints "Hello world!".

• You should be created a Java application in eclipse named lab1. Use the instructions at Java/Eclipse/JavaDoc
• Add a class to the project named HelloWorld
• Type the following codes inside the class and use the run button.

  public class HelloWorld {
  
      public static void main(String[] args) {
          System.out.println("Hello World!");
      }
  
  }
  

The above code is called a "command-line" program. Now lets move to a "GUI" program.

Hello World Java Swing Program

Add a new Java class called HelloWorldGUI1 to your lab0 project. Type the following code inside the HelloWorldGUI1.java file.

import javax.swing.*;

public class HelloWorldGUI1 {
   
   public static void main(String[] args) {
      JOptionPane.showMessageDialog( null, "Hello World!" );
   }

} 

Some Explanations

When the above program is run, a window appears that contains "Hello World!" message and an "OK" button to close the window. In this program we used a Swing built-in class called "JOptionPane". This class has a method "showMessageDialog()" that implements the printing, the button and how to respond to the button (mouse listener).

To know more about this class, you can go to Java Doc, select javax.swing package from the top left window, then select JOptionPane class from the buttom left window. The main window contains the methods of the slected class including "showMessageDialog()".

Note that in Eclipse, when you type the name of the class and a ".", if you wait a little bit, it will show you all the available methods with their arguments. You can just press enter key in one of them and it will be printed for you.

During the following sections you will be learning to implement the similar features of this window by yourself to be able to do more and not be limited to just the implemented features and methods.

---

JFrame and JPanel

In this example we want to create a "Window". Windows can be opened and closed, resized, moved, and their "titles" are displayed in the title bar above them. A Window consists of a Frame and a Convas (Pane).

The following code creates a window with a frame and empty content.

• Make a new Java class called HelloWorldGUI2.
• Type the following code in your class and run the program.

  import javax.swing.*;
  
  public class HelloWorldGUI2 {
     
     public static void main(String[] args) {
        JFrame window = new JFrame("GUI Test");
        window.setSize(250,100);
        window.setLocation(100,100);
        window.setVisible(true);
  
     }
     
  }
  
  

• Play with the window! Look for behaviours such as closing, moving, resizing and havig a title.

Now we want to add some content to our window. The first content is a button that shows "Ok".

import javax.swing.*;

public class HelloWorldGUI2 {
   
   public static void main(String[] args) {
      JButton okButton = new JButton("OK");

      JPanel content = new JPanel();
      content.add(okButton);

      JFrame window = new JFrame("GUI Test");
      window.setContentPane(content); //the blank content is replaced with our content
      window.setSize(250,100);
      window.setLocation(100,100);
      window.setVisible(true);

   }
   
}

---

Events and Listeners

When the user press the "Ok" button in above program, no action will happen. The following code is to add Closing behaviour to our button.

• Write the following class inside your HelloWorldGUI2 class.

  import java.awt.event.*; // put this line before the start of HelloWorldGUI2 class
  
  private static class ButtonHandler implements ActionListener {
     public void actionPerformed(ActionEvent e) {
        System.exit(0);
     }
  }
  

• Add an object of this class to your "Ok" button. Inside the main method, add the following lines:

  ButtonHandler listener = new ButtonHandler();
  okButton.addActionListener(listener);
  

---

Adding More Components

In this section, we will add a second button "No!" to our window.

• Make the button and add it to your JPanel. Look to where the program puts the button.
• Now we want to change the arrangement of the buttons on windown, so that they are not side-by-side, but they are in a column. Change the content.add lines in your program to be:

  import java.awt.*;
  
   content.setLayout(new BorderLayout());
   content.add(okButton, BorderLayout.NORTH);
   content.add(noButton,BorderLayout.SOUTH); //Use your new button's name
  

  Note that here, we have 2 component to add to our content (JPanel). The .setLayout is to define where we want to add these elements. We will learn about layouts in the next lab, but for now, make sure that you replaced the line content.add(okButton) with the new line of code that came above.

---

Activity 1

Modify HelloWorldGUI2 class to have the following behaviour:

• The window have two different tabs
• The first tab is a winodw that contains two button named "Press Me!" and "Like me!"
• When the first button is pressed, the command line prints: "The press button is pushed!"
• When the second button is pressed, the command line prints: "The like button is pushed!"
• The second tab is another window with green background.

Hint: Look at "JTabbedPane" component. First you can make your different JPanels with the above specifications, then add them to an instance of the JTabbedPane class. Then you just need to show your JTabbedPane object (replace it with your current window content).

---

Activity 2

Modify the green background tab to contain a menu "File" with two different options: "New Finder Window" and "New Folder".

Hint: Use an instance of "JMenuBar" class.

---