1 Chapter 4 2D Graphics: Advanced Topics To construct custom shape primitives To apply basic image processing techniques To create fractal images

$Page 1: 1 Chapter 4 2D Graphics: Advanced Topics To construct custom shape primitives To apply basic image processing techniques To create fractal images$
1Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.

Chapter 4 2D Graphics: Advanced Topics

To construct custom shape primitives To apply basic image processing techniques To create fractal images To create 2D animation To perform graphics printing


Custom Shapes

GeneralPath– a legacy class that is final

Path2D– has two subclasses: Path2D.Double

Path2D.Float (aka GeneralPath)– an abstract class so it can be extended

Area– provides constructive area geometry


Shape Interface

The Graphics2D class has methods for drawing and filling Shape objects

Shape is an interface– it has lots of methods

You can implement the interface to create your own Shape class


Shape Interfacepublic boolean contains(Rectangle2D rect)

public boolean contains(Point2D point)

public boolean contains(double x, double y)

public boolean contains(double x, double y, double w, double h)

public Rectangle getBounds()

public Rectangle2D getBounds2D()

public PathIterator getPathIterator(AffineTransform at)

public PathIterator getPathIterator(AffineTransform at, double flatness)

public boolean intersects(Rectangle2D rect)

public boolean intersects(double x, double y, double w, double h)


A Custom Primitive The old-fashioned way Cannot extend the final class GeneralPath Instead, you can create a wrapper for

GeneralPathpublic class Heart implements Shape

{

GeneralPath path;

public Heart(float x, float y,

float w, float h) {

path = new GeneralPath();

…


A Custom Primitive Path2D is an abstract class that implements

shape– Path2D.Float and Path2D.Double are concrete

subclasses Create new classes using inheritance

public class Heart extends Path2D.Double {

public Heart(float x, float y,

float w, float h) {

/* use lineTo, curveTo,etc to

build path */


Other kinds of Path shapes

For parametric curves, use a loop to compute successive points and do lineTo

Example: Try creating a class to represent a general spirograph curve

Example: superellipse


Making Regular Polygons

You could extend the Polygon class and have the constructor generate the vertices for a regular polygon with the desired number of sides


Custom Areas

You can also extend the Area class to create a custom shape

See the HeartArea example in the ~tcole/teaching/cs221/demo/ch4 directory on onyx


Custom Objects What do you do if you want to draw objects

that consist of multiple shapes and/or curves with specific colors?

Create a class with a method that draws the object.– the method should have a Graphics or

Graphics2D parameter– call this method from your paintComponent

method


Image Processing

AWT – push model Java 2D – immediate model JAI – pull model


Image Processing Models

push model - source of image controls the loading– e.g. an image coming across the network– AWT classes

immediate model - image data is immediately available– Java2D classes– BufferedImage

pull model– used by Java Advanced Imaging API


BufferedImage

An image consists of a set of pixels– each pixel has a value associated with it

A BufferedImage contains – Raster -- holds the pixel values– ColorModel -- specifies how to interpret pixel

values BufferedImage has a createGraphics

method which allows you to draw to the image


BufferedImage (Java2D)

BufferedImage bi = new BufferedImage(300, 400, BufferedImage.TYPE_INT_RGB);

Graphics2D g2 = (Graphics2D)(bi.createGraphics());

g2.drawImage(bi, 0, 0, new Component() {});

BufferedImage bi = ImageIO.read(file);

Create

Read

Display


Image Types for BufferedImage

BufferedImage has a set of constants to represent different ways of storing color values– TYPE_INT_RGB– TYPE_BYTE_INDEXED– TYPE_BYTE_GRAY


ColorModel

An abstract class with methods for translating pixel values into colors plus alpha value– DirectColorModel - RGB colors– IndexedColorModel - for color maps


Filtering Images

BufferedImageOp

RescaleOp

LookupOp

AffineTransformOp

ColorConvertOp

ConvolveOp

BufferedImageOp is an interface used for filtering operations

Methods– BufferedImage

createCompatibleImage( BufferedImage, ColorModel)

– BufferedImage filter(BufferedImage src, BufferedImage dest)

– Rectangle2D getBounds2D( BufferedImage src)

– Point2D getPoint2D( Point2D srcPt, Point2D destPt)


BufferedImageOp Implementers

RescaleOp - scale pixel values linearly LookupOp - use a table to convert pixel values ConvolveOp - convolute pixel value with thos of

neighbors ColorConvertOp - pixel-by-pixel color conversion AffineTransformOp - apply the specified

transformation to each pixel Define a custom filter


ConvolveOp

Output pixel is a weighted sum of the values of the pixels in some window surrounding the pixel location– use a 3x3 window

A particular convolution is defined by a 3x3 kernel matrix

Common convolutions include smoothing, sharpening and edge detection


Example Convolutions

Smoothing averages all the pixels in the window.– reduces contrast

Sharpening(edge detection) accentuate differences in neighboring pixel values

1/91/91/9

1/91/91/9

1/91/91/9

0-10

-15 (4)-1

0-10


Low-Level Pixel Manipulation

The Raster class stores an array of pixel values– You can read data for individual pixels but not

change them The Roster class has a subclass called

WritableRaster– This class has methods that allow you to

change individual pixels and groups of pixels


Raster and WritableRaster

int[] getPixel(int x, int y, int[] data)

float[] getPixel(int x, int y, float[] data)

double[] getPixel(int x, int y, double[] data)

int[] getPixels(int x, int y, int w, int h, int[] data)

float[] getPixels(int x, int y, int w, int h, float[] data)

double[] getPixels(int x, int y, int w, int h, double[] data)

void setPixel(int x, int y, int[] data)

void setPixel(int x, int y, float[] data)

void setPixel(int x, int y, double[] data)

void setPixels(int x, int y, int w, int h, int[] data)

void setPixels(int x, int y, int w, int h, float[] data)

void setPixels(int x, int y, int w, int h, double[] data)


Fractals

Fractals are self-similar structures– look the same on all scales– useful for describing many natural phenomena

(coastlines) Koch-Snowflake, Sierpinski Gasket Mandelbrot and Julia sets Fractals are often used in computer graphics


Raster Manipulation

We are going to plot the Mandelbrot set as an example of writing directly to an image raster

To understand the program, we need a little background– complex numbers– bitwise operators


Complex Numbers

Complex numbers are numbers which include numbers like i which is the square root of -1

A complex number has two partsz = x + i y

We visualize the complex plane just like a 2D space with the real part along the x axis and the imaginary part along the y axis


Complex Arithmetic

The standard arithmetic operations are defined for complex numbers– z1 + z2 = (x1 + x2) + i (y1 + y2)

– z1 * z2 = (x1x2 - y1y2) + i (x1y2+ y1x2)

The magnitude of a complex number is– ((x + i y)(x - i y))1/2 = (x2 + y2)1/2


Bitwise Operators

Bitwise operators combine two integers using bit-by-bit logical operations& bitwise AND - use to mask bits

| bitwise OR

>> binary operator to shift bits right

<< shift bits left

^ exclusive or (XOR)

~ complement


Mandelbrot Set

Consider the following iterative equation – zn+1 = zn

2 + c where c is a complex constant

The Mandelbrot set is the set of values of c for which this iteration sequence is bounded– if the magnitude of z ever exceeds 2 for a

given c, that value of c is not in the set

09/19/08

Animation

To make the content of a panel dynamic, we can animate it

An animation consists of a series of rendered images (called frames)

Frame rate should be at least 60 frames per second to make the animation smooth

Frame rate is limited by the time it takes to render the image

09/19/08

Animation Process

You need a way to make something happen at regular intervals– Change some parameter used by the

paintComponent method– call repaint() or revalidate() to cause

paintComponent to be called

09/19/08

Two Approaches

Create a separate thread of execution to handle changes with time– Swing components are not thread-safe so direct

manipulation of the component is not a good idea

– Animation logic is performed in a separate thread

Use the Timer class

09/19/08

Threads Threads allow a program to divide itself into

parts that run independently and simultaneously– threads are not separate processes

The run-time system for Java always has multiple threads running

Create new threads by extending the Thread class or implementing the Runnable interface– Since our classes already extend another class,

use the Runnable interface

09/19/08

Implementing Runnable

public class PanelClass extends JPanel implements Runnable { public PanelClass() { //create and start thread } public void run() {…}}


Animation: Multi-threading

Outline of a typical multi-threading animation

public void paintComponent(Graphics g) {

<* render a frame *>

}

public void run() {

while(true) {

<* update frame data *>

repaint();

try {

Thread.sleep(sleepTime);

} catch (InterruptedException ex) {}

}

}

09/19/08

Timer class

Timer is a Swing Component– delay can be set– generates an ActionEvent after each delay

period– register a Listener to respond to the event


Animation: Timer

Timer timer = new Timer(period, listener);

timer.start();

public void actionPerformed(ActionEvent event) {

<* do frame rendering *>

}

Outline of an animation with Timer


Cellular AutomataThe iteration of the system proceeds by assigning the next state of each cell based on the previous configuration. Each cell follows the same set of rules and the new state depends only upon the current states of the same cell and its neighbors.

Example: A cell is black if exactly one of its neighbors in the current configuration is black

09/19/08

Conway's Game of Life

Birth: a dead cell becomes live if it has exactly 3 live neighbors

Survival: a live cell remains live if it has 2 or 3 neighbors

Death: a live cell with less than 2 or more than 3 neighbors dies

09/19/08

Rendering to Output Devices

Tha Java2D API was defined to do device-independent rendering

Provides access to three output devices– Screen using a Component like JPanel– Image using a BufferedImage– Printer using Printable interface and PrintJob

class


Classes used in Printing

PrinterJob– getPrintJob

– printDialog

– setPrintable

– print

Printable– Print

PageFormat– getOrientation

– getWidth

– getHeight

– getImageableX

– getImageableY

– getImageableWidth

– getImageableHeight

Documents

1 Chapter 4 2D Graphics: Advanced Topics To construct custom shape primitives To apply basic image processing techniques To create fractal images