Some General GUI Background

 

GUIs.  GUI - Graphical User Interfaces are terribly important when developing just about any computer programs.  More and more, the overall tool used to interact with a program is implemented through a web browser, though this is not necessarily the case.  So far we have relied on the showInputDialog( ) and showMessageDialog( ) methods in the JOptionPane class of the swing package for our user interactions.  We have also made use of JTextAreas from the swing package to do some additional things with our output. 

But many, if not almost all of the time, users and developers desire to have forms that are more persistent on a screen.  For example,

  • a calculator program that allows you to change numbers and select different buttons for calculations
  • a database interface that allows the admin to browse through the contents and update
  • a card game to be played on the computer
  •  

Obviously, this list goes on and on.  At present, we will develop some of the most basic GUI necessities.  We will leave the more elaborate for later in the semester and early next semester.

One caveat, remember Java is often used as a development language due to its capabilities to work across platforms.  This implies that developing GUIs in Java is not as simple as it was in Visual Basic where the developer could assume the user had Microsoft Windows running.

The following image represents a fairly sophisticated form used for both inputs and outputs.  Notice it has tabs that can't be used in this GIF representation.

 

 

The following link OCSN Model will take you to the actual form.  You will need to select a number for the number of client stations.  You might as well choose four or five.  You will also need to enter the common time units, something like hours, minutes or days.

Notice how you need to interact with a couple JOptionPanes to determine the initial configuration of the GUI.  The tabs take you between the input/output panels for each client, a central server and a panel for routing.  There are labels all over the pages to describe the purpose of each text box.  Some text boxes are editable by the user.  Other text boxes are written to by the program and can't be changed by the user.  Notice there are sliders on almost all of the pages.

This GUI is far more elaborate than we will get to in this semester.  But hopefully, it gives you some sense of where you will get to in the future.

Basic GUI Elements.  What we will do in this webpage is generally describe the basic necessities that you will need for the next few weeks while getting comfortable with GUI development.  We will go into more detail in subsequent webpages.

GUI implementations with JApplets are quite commonplace and GUIs can be developed for applets based on extending JApplet.  For applications, the overall inclusive class usually extends JFrame.  So for GUI development we will make sue of the following.

  • extending JApplet for GUIs in applets
  • extending JFrame for GUIs in applications

For several weeks we will rely on two overall layouts.

  • FlowLayout
    • components are laid out in accordance with the order they are added
    • layout rearranges if user changes size of applet window
    • difficult, if not impossible, to get things to layout as desired
  • GridLayout
    • similar to a table to organize components with numbered cells to locate components

There are many other layouts such as CarfLayouts, PopupMenus and so on.  The OCSN model GUI makes use of JTabbedPanes and GridBagLayouts.  We will not study any of these for quite some time.

Now comes the issues of our main container.  While there are other options, JPanel seems to be the best overall.

  • JPanel
    • can add several to another JPanel in order to segment layout

At present, we will only be concerned with four different components or controls as they are sometimes called.

  • JLabels
  • JTextField
  • JTextArea
  • JButton

You might expect there are many other components for things like radio buttons, combo boxes and son on.  This is the case, but we will not make use of them for quite some time.

In order to get the program to recognize user interactions with the overall GUI we will make use of

  • ActionListener
    • need to implement an addActionListener in order to get the program to monitor particular components
    • use the actionPerformed method to monitor for actual user inputs

Much more will be said about these in subsequent webpages.