Home : Course Map : Chapter 6 : Java : Supplements :
Java2D: Gradients & Textures
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

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.

If continuing along that line past the point the color continues to alternate then the gradient is called cyclic. If the color remains constant then it is non-cyclic.

The first demo creates first a cyclic gradient from red to blue and then uses it as paint for the fill of an ellispe and then for the border.

A non-cyclic red-to-blue gradient is then created and used as the fill for an ellipse.

 
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

            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.