Home : Course Map : Chapter 6 : Java :
Drawing
JavaTech
Course Map
Chapter 6

Introduction
AWT
Swing
Containers
  Demo 1
UI Components
  Demo 2
UI Layout
  Demo 3   Demo 4
Text Display
  Demo 5
Drawing
  Demo 6   Demo 7
Draw Polygons
  Demo 8   Demo 9
Colors
Text Draw 
  Demo 10
Images
  Demo 11
Exercises

    Supplements
AWT
  Demo 1
Drawing
  Demo 2
Text Drawing
  Demo 3
UI Components
  Demo 4

Java2D
Shapes & Areas
  Demo 1   Demo 2
Stroke & Paint
  Demo 3
Transforms
  Demo 4
Gradients&Textures
  Demo 5   Demo 6
Text
  Demo 7   Demo 8
     About JavaTech
     Codes List
     Exercises
     Feedback
     References
     Resources
     Tips
     Topic Index
     Course Guide
     What's New

You can, of course, do your own graphics within the AWT and Swing. In the basic AWT you draw on a Panel or a Canvas component by overriding their paint(Graphics) method (see the Chapter 6: Basics: Drawing section).

In Swing the JPanel class usually serves as the drawing board. You override its PaintComponent(Graphcs) method with code for your drawing instructions.

Note that since all the Swing components are lightweight, you can override their painting methods and add new features to their display. For example, you could make a custom button with a custom appearance in the pressed and unpressed states.

Graphics Context

The paintComponent(Graphics g)method includes an instance of the Graphics class as an argument . The graphics context represents a drawing surface and all of its graphics settings such as the current foreground and background colors, the fonts to be used for strings, etc.. The class is referred to as the graphics context class since it provides the context under which the graphics commands operate for a component.

The graphics context does not need to represent a visible component but can be an off-screen image.

After version 1.2, the core language included a subclass of Graphics called Graphics2D. In provides a far more extensive and sophisticated set of drawing capabilities. An introduction to Java2D is given in the Chapter 6: Java : Supplements section. An instance of the Graphics2D class can be cast from the Graphics instance passed in the paint(Graphics g) method in Component and the paintComponent(Graphics g) method from JComponent.

Coordinate System

Note that the basci AWT coordinate system for the Graphics context methods goes as follows:

  • Origin (0,0)- top left hand corner
  • x (in pixels) - increases towards the right
    • Maximum x = width - 1
  • y (in pixels) - increases towards the bottom
    • Maximum y = height -1

We can obtain the dimensions of a component in two ways. The getSize() method returns an instance of the Dimension class, which provides direct access to its height and width variables. As of Java 1.2, the component class includes the methods getHeight() and getWidth() so you can obtain each of these dimensions separately.

Negative values and positive values beyond the width and height of the drawing area do not cause errors but are treated as valid coordinates (though, any drawing in those areas will be unseen, of course.)

Basic Graphics Commands

Here are some of the drawing methods in the Graphics class :

  • setColor(Color c)
    Set the current pen color, where c has several standard choices such as
    Color.black, Color.blue, Color.red
    , etc.

  • drawLine(int x1, int y1, int x2, int y2)
    Draw a line between points (x1,y1) and (x2,y2)

  • drawRect (int x, int y, int width, int height) and
    fillRect (int x, int y, int width, int height)

    Draws (fills) a rectangle, (x,y) are the coordinates of the top left corner, the bottom right corner will be at (x+width,y+height).

  • drawOval (int x, int y, int width, int height) and
    fillOval (intx, int y, int width, int height)

    Draws (fills) an oval bounded by the rectangle specified by these parameters.

  • draw3DRect (int x, int y, int width, int height, int arcWidth, boolean raised) and
    fill3DRect (int x, int y, int width, int height, boolean raised)
    Draws (fills) a rectangle with shaded sides that provide a 3-D appearance.

  • drawRoundRect (int x, int y, int width, int height, int arcWidth, int arcHeight)
    and fill3DRect (int x, int y, int width, int height, int arcWidth, int arcHeight)
    Draws (fills) a rectangle with rounded corners.

  • drawArc(int x,int y,int width, int height, int startAngle, int arcAngle)
  • drawPolyline (int[] x, int[] y, int N)
    Draws lines connecting the N points given by the x and y arrays.

  • drawPolygon (int[] x, int[] y, int N)
    Draws lines connecting the points given by the x and y arrays. Connects the last point to the first if they are not already the same point.

So for the instruction

   drawRect(x,y,width,height)

(x,y) are the coordinates of the top left corner and the bottom right corner will be at (x+width,y+height).

Note that Graphics does not provide a method to set the width of a line. The line is always one pixel wide and continuous (i.e., no dot-dash options). Nevertheless, these methods are simple and often convenient to use and can be used along with the Graphics2D methods.

See the API Specifications for other methods in the Graphics class.

Drawing Demo Applet

This applet illustrates more of the drawing methods in the Graphics class:

import java.swing.*;
import java.awt.*;

/** Illustrate basic drawing in a Swing applet. **/

public class DrawApplet extends JApplet

{
  public void init () {
    Container content_pane = getContentPane();

    // Create an instance of DrawingPanel
    DrawingPanel drawing_panel =  new DrawingPanel ();

    // Add the button to the content pane.
    content_pane.add (drawing_panel);
  }
}
// class DrawApplet

/** Draw on this JPanel rather than on the JApplet. **/
public class DrawingPanel extends JPanel {

  DrawingPanel () {
    // Set background color for the applet's panel.
    setBackground (Color.WHITE);
  } // ctor

  public void paintComponent(Graphics g)   {
   // Paint background
   super.paintComponent(g);

   
// Get the drawing area
   int dy = getSize ().height;
   int dx = getSize ().width;
   int mid_y = dy/2;
   int mid_x = dx/2;
   int rect_x = 3 * dx/4;
   int rect_y = 3 * dy/4;

   // Set current drawing color
   g.setColor (Color.BLACK);

   // Draw a rectangle centered at the mid-point
   g.drawRect (mid_x-rect_x/2, mid_y-rect_y/2
               rect_x, rect_y );

   // Set a new drawing color
   g.setColor (Color.LIGHT_GRAY);

   // Fill a rectangle centered at the mid-point. Put it
   // within the previous rectangle so that border shows.

   g.fillRect (mid_x-rect_x/2 + 10, mid_y-rect_y/2+10,
               rect_x-20, rect_y-20);

   // Set a new drawing color
   g.setColor (Color.DARK_GRAY);

   // Draw a circle around the mid-point
   g.drawOval (mid_x-rect_x/6, mid_y-rect_y/6,
               rect_x/3, rect_y/3);


   // Fill an oval inside the circle
   g.fillOval (mid_x-rect_x/6+10, mid_y-rect_y/6+10,
               rect_x/3-20, rect_y/3-20);

  } // paintComponent

} // class DrawingPanel

 

We will discuss more about Java graphics in this and following chapters. However, the capabilities, and subtleties, of Java graphics are now quite extensive and cannot be fully covered here.

See the following pages for supplementary information about Java graphics and the classes involved.:

References & Web Resources

Latest update: Nov. 3, 2006

            Tech
Java Tech Graphics
Starting to Plot
  Demo 1
Drawing Panel
  Demo 2
Histogram Display

  Demo 3
Exercises

           Physics
Display Text Data
  Demo 1
Plot Data
  Demo 2
Find Max/Min
  Demo 3
Exercises

  
  Part I Part II Part III
Java Core 1  2  3  4  5  6  7  8  9  10  11  12 13 14 15 16 17
18 19 20
21
22 23 24
Supplements

1  2  3  4  5  6  7  8  9  10  11  12

Tech 1  2  3  4  5  6  7  8  9  10  11  12
Physics 1  2  3  4  5  6  7  8  9  10  11  12

Java is a trademark of Sun Microsystems, Inc.