Drawings On Pictures


At the completion of this lab you should be able to:

The Drawing API

In order to draw we need an object that provides tools that can be used to draw lines, rectangles, ovals, text strings and so forth. In Java this "drawing object" is called a graphic context and is provided by the Graphics class in the java.awt package. Pictures have a graphics context that we can get using the getGraphics() method. This context allows us to draw upon the image represented by the Picture object.

Some of the methods provided by the Graphics object are:

The full documentation on the API can be found in the Java 5.0 API documentation. Open this documentation on your lab computer. Select the java.awt package in the upper left-hand window and then select the Graphics class from the class list in the lower left-hand window. The description of the class contains a lot of information, but for now scroll down and look through the methods that are available.

Question: Which method do you think you would use to draw a line that connected eight points of the form (xi,yi)?

When you think you know the answer call the instructor over and tell him which method you would use. Be prepared to explain how you would use the method.

Instructor's Initials:

Copy the method from Figure 1 and place it in your Picture class. This method allows a solid rectangle to be drawing on an image. Write a main Java program that uses a picture of your choice and places a red rectangle somewhere in the picture.

 * Method to draw a filled box on the current picture
 * @param color the color to draw the box with
 * @param topLeftX the top left x coordinate of the box
 * @param topLeftY the top left y coordinate of the box
 * @param width the width of the box
 * @param height the height of the box
public void drawBox(Color color, int topLeftX, int topLeftY, int width,
                    int height)
  // get the graphics context
  Graphics g = this.getGraphics();

  // set the current color

  // draw the filled rectangle
  g.fillRect(topLeftX, topLeftY, width, height);

Figure 1:  drawBox Method

Once you have your program working, call the instructor over and demo your program. Be prepared to describe how the drawBox() method works.

Instructor's Initials:

Writing on an Image

In order to write on an image, the drawSting(String str, int x, int y) method of the Graphics class is used. This method draws the string specified by str on the image, where x and y specify the baseline, the line the string is written on, of the string. The string is drawn using the current color and current font of the graphics context.

Of course it is much more interesting to specify the color and the font to use. Figure 1 illustrated how to use the setColor() method to set the drawing color. In the same manner, the setFont() method can be used to set the drawing font. Using the interaction pane, type the commands in Figure 2 to get a list of the fonts available on your computer.

  >import java.awt.*;
  >GraphicsEnvironment env = GraphicsEnvironment.getLocalGraphicsEnvironment();
  >String[] nameArray = env.getAvailableFontFamilyNames();
  >for (int i=0; i < nameArray.length; i++)

Figure 2:  Listing Available Fonts

When the instructor types these commands on his computer one of the fonts that is listed is Georgia. The current font for a graphics content g can be set to 24 point, bold, Georgia using the command: g.setFont(new Font("Georgia",Font.BOLD,24)). Using this information add a method drawString(String text, int x, int y) to your Picture class. The method should draw a String on a the picture object using a color and font you choose. Set both the font and the color inside the drawSting() method. Write a Java main program that uses this method to draw a string of your choice on a picture.

When you have your program working, call the instructor over and demo it.

Instructor's Initials:

Advance Drawing Using Inheritance

The Java Graphics2D package provides a set of advanced drawing tools. For instance, it provides the facilities to set the width of the drawing brush, to scale images, to sheer images, to fill drawing objects with textures and many more advanced methods. While providing advanced features, it, nevertheless, provides access to the drawing methods of the Graphics object. This magical access is provided via the object-oriented concept of inheritance.

In order to briefly explore the concept of inheritance, open the Java 1.5 API documentation in your browser. Select the java.awt package and the Graphics2D class. Note the inheritance tree given in the top section of the Graphics2D page. This tree lists the relationship between parent classes and child classes in the Graphics2D class hierarchy. The uppermost class, grandparent in this case, of the Graphics2D class is the Object class. All Java classes are derived from the Object class, which means that every Java class inherits (has the same) public methods and public fields as the Object class. Thus the Graphics class has all the public methods and fields that the Object class has plus methods and fields of its own. Likewise, the Graphics2D class has all the public methods and fields of both the Object class and the Graphics class.

The relationship between classes is said to be an "is-a" relationship as it is applied to objects. Thus a Graphics object is-a Object object. Likewise, a Graphics2D object is-a Graphics object. It is also true that a Graphics2D object is-a Object object. One aspect of these class hierarchies in an object-oriented language like Java is that objects can be converted for use as any type of object higher in the class hierarchy by simply casting. For instance if we have a Graphics2D object, say g, we can always treat it as a Graphics object using the command:   (Graphics) g. The general rule is: An object lower in the class hierarchy can always be cast to an object higher in the class hierarchy. The reverse, casting an object higher in the class hierarchy to one lower in the class hierarchy is not generally possible.

Graphics2D objects when used with images in Java are a special case. Each image in Java is associated with a Graphics2D object rather than just a Graphics object. If this is true, then how did the methods above that used the line Graphics g = this.getGraphics() work?


Instructor's Initials:

The commands to setup the use of a Graphics2D context for drawing on an image is given Figure 3. Note the cast that is really a cast back to the original Graphics2D object of the image.

  Graphics   graphics = this.getGraphics();
  Graphics2D g2D = (Graphics2D) graphics;

Figure 3:  Code to Get a Graphics2D Context

X-ing It Out

Create a method for the Picture class with the following signature:

    public void drawWideDashedX(Color color, float width)

that draws a red X using a dashed line of the specified width across the picture. Your textbook lists a few helpful Java API methods on pages 246-248. More information on drawing methods is available, of course, in the Java 1.5 API documentation for the Graphics and Graphics2D classes.

When your method works call the instructor over and demo it.

Instructor's Initials:

Fully Functional Scaling

The Graphics2D object provides a general scaling method for images. This procedure is based upon creating an AffineTransform object that can be applied to create a new picture object. Your textbook presents a general scaling method in Program 60. Add this method to your Picture class, and test it out. After you have it working, add it to your image processing project to scale a picture to 0.75 times it original size.

When you have your program working, call the instructor over and demo it.

Instructor's Initials:

The End