Graphical User Interfaces (GUI)
Create a Graphical User Interface (GUI-based) application that converts a temperature in Fahrenheit to Centigrade and vice verse. See picture below.
See image: see image.
GUI-based Program
A program that contains a Graphical User Interface (GUI) is called a GUI-based program. It uses GUI components for interfacing with the user.
A GUI Component
A GUI component is a visual component that a user can use for communicating with the program . Buttons, text fields, menus, drop-down lists etc are all examples of GUI components.
GUI Object
Internally, each GUI component is a program object. For example, two buttons displayed above are internally two JButton objects. Similarly, other GUI components above are also objects of Java classes such as JPanel, JTextField, JLabels, etc.
Difference Between a GUI Object and Non-GUI Object
Both a GUI Object and a non-GUI object have internal representations consisting of its field values and methods. However a GUI Object additionally has an external representation that a user can visually see. The Java runtime keeps the two representations always in synch. For example, each GUI program starts by displaying a window. This window is an external representation of an internal JFrame object. When the user changes the width of a JFrame window visually by clicking and dragging the mouse, the internal value of the field named "width" also changes accordingly. Similarly, when the program changes the value of field named width by calling the method setWidth, the external width of the JFrame window also changes accordingly. The two representations always stay in synch.
Creating a GUI program
You can create a GUI program by creating an object of JFrame. However, this program would have minimal functionality.
In creating a practical GUI program, we extend the JFrame class using inheritance and then add functionality to it. Then we create an object of extended JFrame class and display the extended JFrame object.
Content Pane
In creating a GUI-based program, the programmer first extends the JFrame class. Then, in its constructor, the programmer creates a main JPanel object and puts all the needed GUI in it. Then the programmer makes the main JPanel as the content pane. When the main JPanel is made into a content pane, all the GUI in it becomes the GUI of the running program. (Note that the main JPanel may contain other JPanels which may contain GUI objects. Above, the main JPanel object contains three JPanel objects. Each of which contain other GUI objects).
Creating a GUI program involves the following:
JFrameExt class
Create a class that extends JFrame (e.g JFrameExt). In the constructor of this class, create the GUI as below:
TestJFrameExt class
Create another class containing the main method (e.g. TestJFrameExt class). In the main method, do the following:
Note that when you create the JFrameExt, its constructor is called which creates its GUI. So when the main method shows the JFrameExt object, you will see the GUI.
Synchronous I/O
In this type of I/O, the program initiates input/output activity and is called Synchronous I/O. For example when you use showMessageDialog and showInputDialog methods of the class JOptionPane for input and output.
Asyncronous I/O or Event Driven I/O
In this type of I/O, the user initiates the input/output activity and is called Asynchronous I/O or Event Driven I/O. For example, the user may initiate I/O by clicking on a button or by selecting a menu item. In this type of I/O, each time user initiates an I/O activity, the system creates an event. The program responds to the event by invoking an event handler.
GUI Programs
All GUI based programs use Event Driven I/O. For example, when the user selects a menu item such as Open File, it results in an event. This event results in invoking a method (event handler) in the program that responds to the user request.
Thus a GUI program is made up of a number of event handling methods which are invoked to handle specific events.
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
public class JFrameExt extends JFrame implements ActionListener{
private JPanel jpMain = new JPanel();
private JPanel jpFrom = new JPanel();
private JPanel jpTo = new JPanel();
private JPanel jpOp = new JPanel();
private JLabel jlbFrom = new JLabel("From");
private JLabel jlbTo = new JLabel ("To ");
private JTextField jtfFrom = new JTextField(10);
private JTextField jtfTo = new JTextField(10);
private JButton jbtFtoC = new JButton("FtoC");
private JButton jbtCtoF = new JButton("CToF");
public JFrameExt (){
setTitle ("Converter");
setSize(400, 200);
setVisible(true);
//set jpMain layout
GridLayout gl = new GridLayout (3,1);
jpMain.setLayout(gl);
//add panels to jpMain
jpMain.add(jpFrom);
jpMain.add(jpTo);
jpMain.add(jpOp);
jpFrom.setBackground(Color.red);
jpTo.setBackground(Color.green);
jpOp.setBackground(Color.magenta);
//Make jpMain as the content pane
this.setContentPane(jpMain);
//add components to panels
jpFrom.add(jlbFrom);
jpFrom.add(jtfFrom);
jpTo.add(jlbTo);
jpTo.add(jtfTo);
jtfTo.setEditable(false);
jpOp.add(jbtFtoC);
jpOp.add(jbtCtoF);
//register this object as a listener with buttons
jbtFtoC.addActionListener(this);
jbtCtoF.addActionListener(this);
}
//Listener method
public void actionPerformed(ActionEvent ev) {
String sFrom,sTo;
double dFrom, dTo;
sFrom = jtfFrom.getText().trim();
dFrom = Double.parseDouble(sFrom);
if (ev.getSource()==jbtFtoC){
dTo = 5.0/9.0 * (dFrom - 32.0);
sTo = "" + dTo;
jtfTo.setText(sTo);
}
else if (ev.getSource()==jbtCtoF){
dTo = (9.0/5.0 *dFrom) + 32.0;
sTo = "" + dTo;
jtfTo.setText(sTo);
}
}
}