Chapter 3

!

Widgets





Welcome to the JavaJoint Cafe! Gigobite, the lablet for this chapter, displays an order form that might be used in a cyber-age fast food restaurant. You can select items to be ordered, indicate other features about the order, and then click on a button to "place the order." Since we haven't shown you how to write the Java code to get your applets to respond to the user's choices and instructions, our order form doesn't actually do anything with your order information. It does, though, demonstrate how easy it is to create and manipulate Java widgets to produce interactive, visually appealing, and interesting applets.


Lab Objectives

In this lab, you will:
 o

Run the Chapter 3 lablet and make use of its widgets.

 o

Experiment with the lablet by changing the properties of its widgets, and observing the changes in the applet's appearance.

 o

Add some widgets of your own to extend the applet.

Exercises

  1. Gigobite presents a collection of Java's widgets--the built-in buttons, lists, choice boxes, labels, text fields and text areas that are used to create graphical user interfaces--for you to interact with. Your job at this point is to run the program and to see how its appearance is described in the Java source code.

    1. Run the lablet now. If necessary (in a non-browser environment), resize the applet window until the screen looks something like Figure 3.2 [p. 91] in the text.

    2. Use the applet. That is, click on its list items, its check boxes, and its buttons. Enter some text in the text fields and areas.

    3. Part of the Java source code for the Gigobite class is listed below. The listing is annotated with questions about how the code describing the widgets relates to how the widgets are displayed. Answer the questions below by looking at the applet window, and by using any Java documentation (like the text or what Sun provides on their Web site) that you need.
       
      public class Gigobite extends Applet
      {
         ...
      
      What does 18 signify in the following line?
      Answer:  
         TextField reminder = new TextField("Ask for Coupons!", 18);
      
      What is the difference between true and false in the following lines?
      Answer:  
         List sandwiches = new List(5,true);
         List drinks = new List(5,true);
         List sides = new List(3,false);
         ...
      
      What do 2 and 10 mean in the following line?
      Answer:  
         TextArea comments = new TextArea("Hold the pickles!", 2, 10);
         ...
         public void init()
         {
            ...
      
      What does the following line do?
      Answer:  
            setBackground(Color.yellow);
            ...
      
      In what style will sandsLabel appear?
      Answer:  
            sandsLabel.setFont(myFont2);
      
      What's the difference between setForeground() and setBackground()
      in the two lines below?
      Answer:  
            drinkLabel.setBackground(Color.cyan);
            sidesLabel.setForeground(Color.red);
            ...
         }
      }
      

  2. It is time to experiment a bit more actively with the class Gigobite. Here we'll ask you to change the program, recompile it, and run it to observe differences in its appearance.

    1. First, alter the order in which the items are added to the sandwiches List. Do the same for the sizes Choice object. Compile and run your revised program, noting the differences you detect. How does the order of adding items determine the order of the display?
      Answer:

    2. Now, change the order in which the widgets themselves are added to the applet. Compile and run program and, again, note how your changes to the code are reflected in the applet's appearance. You should see that, in this applet, widgets are "flowed" into the applet, left to right and top to bottom, just as we write (at least in languages like English, French, Spanish, and German).

    3. Notice how the fonts, sizes, background and foreground colors of individual components can be specified. Write the code to change the sizes, font, and colors of any of the existing widgets. Compile and run your version of the applet to test it out.


  3. We can now talk about making more extensive changes to class Gigobite. Use the original code as a model for making the following extensions. Compile and run the applet after each stage to make sure that it behaves as you expect it to.

    1. Add widgets to the applet to describe a few different "Combo-Meals" (that is, combination meals composed of a sandwich, a side order, and a drink). Describe the combo-meals in a list, and add a label that identifies the list. Then, add a few combo-meals as items to your list.

    2. Follow the same basic procedure as in part (a) to add widgets to the Gigobite applet to describe a desserts menu.

    3. Add a check box to indicate that the current order is "Special"--that is, requires some special action.

    4. Add a choice widget that indicates whether a particular order is for eating in or taking out.

    5. Finally, add code to the lablet that draws some simple logo for Gigobite around or near the name on the applet window. The logo can be in the form of a text slogan, or can be some type of figure drawn using Java's basic drawing commands.

Postlab Exercises

  1. Write an applet that displays an order form for some merchandise. You can use an order form that you have seen on the Worldwide Web as an example (look at the order form for downloading a new version of Netscape, for instance), or look in any mail-order catalog for a simple form to lay out on the screen.

Last updated: December 4, 1998
Rick Decker
Department of Computer Science
Hamilton College
Clinton, NY 13323