Learning Java - Chapter 6 : Java : Supplements

The two demos here illustrate how to make gradient paint patterns and textures from images.

A gradient is created by specifying a color at one point and another color at another point. The colors will then gradually change from one to the other along a straight line between the two points.

GradientsApplet.java

import javax.swing.*;
import java.awt.*;
import java.awt.geom.*;

/** Demonstration of gradient coloring in Java2D. **/
public class GradientsApplet extends JApplet
{
  public void init () {
    Container content_pane = getContentPane ();

    // Create an instance of DrawingPanel
    GradientsPanel gradients_panel =
        new GradientsPanel ();

    // Add the DrawingPanel to the content pane.
    content_pane.add (gradients_panel);

  } // init
} // GradientsApplet

/** Panel on which to draw shapes with gradient paint. **/
class GradientsPanel extends JPanel
{
  public void paintComponent (Graphics g) {
    // First paint background
    super.paintComponent (g);

    // The context that is passed is actually
    // the Graphics2D sub-class of Graphics. So
    // we can cast it to Graphics2D and take advantage
    // of the additional tools that it has.
    Graphics2D g2 =  (Graphics2D)g;

    // Create an ellipse object
    Ellipse2D e = new Ellipse2D.Float (20, 20, 60, 100);

    // Grade the colors red to blue from point  (40,40)
    // to point  (60,60). The last argument is "true" so
    // repeat the pattern, i.e. cyclic is true.
    GradientPaint gp = new GradientPaint (40, 40, Color.red,
        60, 60, Color.blue, true);

    // Set the paint to the gradient pattern
    g2.setPaint (gp);
    // and then fill the ellipse.
    g2.fill (e);

    // Move the ellipse 80 pixels to the right
    e.setFrame (100, 20, 60, 100);
    // Set a thick stroke and then draw it with the current
    // gradient paint.
    g2.setStroke (new BasicStroke (8));
    g2.draw (e);

    // Move the ellipse another 80 pixels to the right
    e.setFrame (180, 20, 60, 100);
     // Grade the colors red to blue from point  (120,120)
    // to point  (140,140). Here we set cyclic to false.
    gp = new GradientPaint (120, 120, Color.red,
        140, 140, Color.blue, false);
    g2.setPaint (gp);
    g2.fill (e);

  } // paintComponent

} // class GradientsPanel

A texture is a pattern created by tiling a rectangular image, i.e. redrawing the basic tile in rows and columns, .

The tile is created from a Rectangle2D object and an instance of BufferedImage. The BufferedImage is scaled to fit into the Rectangle2D.

Note: the BufferedImage is a new class for Java 1.2 that won't be discussed in detail here. It provides many useful features including easier access to image data than the old Image class. It is more often used in Java2D than Image.

The demo below shows how to create a texture from an image and then to use it to fill a rectangle, ellipse and in the border of a rectangle.

TextureApplet.java

import javax.swing.*;
import java.awt.*;
import java.awt.geom.*;
import java.awt.image.BufferedImage;

/**  Demonstration of gradient coloring in Java2D.**/
public class TextureApplet extends JApplet
{
  public void init () {

    Container content_pane = getContentPane ();

    // Create an instance of DrawingPanel
    TexturePanel texture_panel =
        new TexturePanel (getBufImage ());

    // Add the DrawingPanel to the content pane.
    content_pane.add (texture_panel);
  } // init

  BufferedImage getBufImage () {
    // Get the image for the texture.
    java.net.URL url=null;
    try {
      url = new java.net.URL (getCodeBase (),"Apollo16Lander.jpg");
    } catch (java.net.MalformedURLException e) {
        String msg = "Error loading image Apollo16Lander.gif";
        System.err.println (msg);
        showStatus (msg);
        System.exit (0);
    }
    // Grab an image using this trick with ImageIcon which
    // doesn't return until the image is loaded.
    Image img = new javax.swing.ImageIcon (url).getImage ();

    // Create a BufferedImage object for the texture class.
    // Should be same size as the Image
    BufferedImage buf_image =
      new BufferedImage (img.getWidth (null),
                         img.getHeight (null),
                         BufferedImage.TYPE_INT_RGB);

    // Get the  (offscreen) graphics context for this image
    Graphics2D g2 = buf_image.createGraphics ();

    // Draw the image onto the context  (remember
    // that this is all offscreen.
    g2.drawImage (img,null,null);
    return buf_image;

  } // getBufImage

} // class TextureApplet

/** Panel on which to draw shapes with textured strokes. **/
class TexturePanel extends JPanel
{
  BufferedImage fBufImage;

  TexturePanel (BufferedImage bImg) {
    fBufImage = bImg;
  }

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

    // The context that is passed is actually
    // the Graphics2D sub-class of Graphics. So
    // we can cast it to Graphics2D and take advantage
    // of the additional tools that it has.
    Graphics2D g2 =  (Graphics2D)g;

    // Create a texture rectangle the same size as
    // the texture image.
    Rectangle2D tr = new Rectangle2D.Double (
                      0, 0,
                      fBufImage.getWidth (),
                      fBufImage.getHeight ());

    // Create the TexturePaint.
    TexturePaint tp = new TexturePaint (fBufImage, tr);

    // Create a round rectangle.
    RoundRectangle2D r =
      new RoundRectangle2D.Float (25, 35, 150, 150, 25, 25);

    // Now fill the round rectangle with the texture.
    g2.setPaint (tp);
    g2.fill (r);

    // Create an ellipse object and fill it with the texture.
    Ellipse2D e = new Ellipse2D.Float (200, 35, 100, 150);
    g2.fill (e);

    // Create a rectangle object and then set to a thick stroke
    // so that the current texture will be visible.
    Rectangle2D r2 = new Rectangle2D.Double (320, 35, 150, 150);
    g2.setStroke (new BasicStroke (20));
    g2.draw (r2);

  } // paintComponent

} // class TexturePanel

Latest update: Oct. 27, 2004