CS 105 Lab 4 -- Fall 1998

Last week, we led you through the construction of a simple Java program in order to give you some familiarity with the MetroWerks programming environment and an introduction to the programming process.

This week we will concentrate on increasing your understanding of the programming process itself. We will again lead you through the construction of a simple program. This time, however, we won't tell you exactly what Java instructions you need to type. We will explain what methods are needed and what each method should do in English. Your job will be to translate our English descriptions of the methods into Java.

In addition to giving you the experience of writing Java instructions of your own, this week's lab is also designed to give you some experience using a few examples of the two main mechanisms used within applets to interact with the users of an applet: graphics drawing primitives and primitives for constructing user interface components. Many of the details you will need to work with these Java mechanisms are not included in this document. Instead, they have been discussed in class and can be found in a separate "Java Programming with JavaTools" handout. The following link will take you to this JavaTools documentation . Printed copies of this handout will also be made available to you before lab. The handout describes all of the Java graphics primitives and user interface components. You will only be concerned with the graphics primitives for drawing text and rectangles of various colors and the "Slider" user interface component.

The applet you construct in this lab will implement a tool that might be of use to a web page designer. The applet will provide controls to allow its user to select potential background colors for a web page by using scrollbars to vary the mixture of red, green and blue in the background color of the applet.

A working version of the completed applet is included to the right so that you can understand its functionality.

The applet displays three scrollbars. Each scrollbar can be used to increase or decrease the amount of one color included in the mix that produces the color displayed. Although they are not labeled (to keep your task simple), the top scrollbar controls the amount of red used in the background, the middle scrollbar contains green and the bottom scrollbar controls blue.

In addition, the applet displays three numbers between 0 and 255 at the bottom of the applet screen region indicating the amount of each color used in the current background color. To help the user know which number is associated with each color, the numbers are drawn within rectangles of the colors to which they correspond.


In constructing this applet you should recognize that you will also get a sense of the programming steps that are involved in the construction of pieces of "real software" you have used. For example, the PhotoShop "Color" options palette provides a mechanism for mixing colors using scrollbars very similar to the applet you will produce.


To simplify printing, a version of the complete instructions for this lab as a single page is also available. Otherwise, follow the links below to read the remainder of this lab description.
  • Preparation
  • Laying Out the Scrollbars
  • Drawing the Color Display
  • Making the Colors Vary
  • A Final Detail
  • Finishing Up
  • If you have questions about the instructions for this lab, you are encouraged to ask them through the discussion area for this lab in the course discussion forum.