2 Chapter 2D Graphics: Basics
3 3 3 3 3 3 3
The architecture and operations of a 2D graphics system The coordinate spaces in a rendering pipeline Java 2D program structure and the Graphics2D object The basic 2D geometric primitives 2D coordinate systems and equations of graphs Constructing custom shapes using GeneralPath class Constructive area geometry
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
1
Rendering Pipeline
1. Construct the 2D objects. 2. Apply transformations to the objects. 3. Apply color and other rendering properties. 4. Render the scene on a graphics device.
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
2
A Simple Java 2D Program
3
Usually have at least two classes
A class that extends JApplet to serve as the high level container
The main method needs to create a JFrame for a stand-alone application x the init method creates a panel and adds it to the applet
x
A class that extends JPanel to serve as the drawing surface
x
The paintComponent method contains code to do the drawing
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
3
paintComponent
public void paintComponent(Graphics g) { super.paintComponent(g); Graphics2D g2 = (Graphics2D)g; // code to draw desired picture }
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
4
Graphics class
3
Original AWT classes had a graphics context which was a Graphics object
No separation of modeling and rendering
3
Swing classes have a Graphics2D context
Parameter of the paintComponent method still has type Graphics The actual argument to paintComponent is a Graphics2D object so it can be cast
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
5
The Graphics2D Class
3 3 3 3
Java 2D rendering engine Extends the Graphics class Encapsulates all rendering functions Two ways to access the graphics context void paintComponent(Graphics g){ } Graphics getGraphics()
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
6
Methods of Graphics Class
3
Data includes the following
Foreground color Font Rendering modes
void void void void
setColor(Color c) setFont(Font f) setXORMode(Color c) setPaintMode()
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
7
Methods of Graphics Class
void drawLine(int x1, int y1, int x2, int y2) void drawRect(int x1, int y1, int width, int height) void drawOval(int x1, int y1, int width, int height) void drawArc(int x1, int y1, int width, int height, int start, int arc) void drawRoundRect(int x1, int y1, int width, int height, int arcW, int arcH) void drawPolygon(int[] xPoints, int[] yPoints, int nPoints) void fillRect(int x1, int y1, int width, int height) void fillOval(int x1, int y1, int width, int height) void fillArc(int x1, int y1, int width, int height, int start, int arc) void fillRoundRect(int x1, int y1, int width, int height, int arcW, int arcH) void fillPolygon(int[] xPoints, int[] yPoints, int nPoints) void drawString(String str, int x, int y) void translate(int x, int y)
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
8
Graphics 2D
Graphics2D extends Graphics 3 New properties include
3
Stroke Paint
3
New capabilities
drawing and filling Shape objects applying AffineTransforms
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
9
Methods of Graphics2D Class
void void void void void void void void void draw(Shape s) fill(Shape s) setTransform(AffineTransform Tx) transform(AffineTransform Tx) setPaint(Paint p) setStroke(Stroke s) clip(Shape s) setComposite(Composite c) addRenderingHints(Map hints)
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
10
2D Coordinate System
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
11
Java 2D Coordinate System
3
Screen coordinates work differently
y-axis pointing downward
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
12
2D Objects
A 2D object consists of a set of points in a plane 3 Examples
3
point lines, curves shapes like rectangles, ellipses, polygons text and images
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
13
Line
Points on a line satisfy a linear equation Ax + By + C = 0
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
14
How to specify a line
With an equation 3 By giving the value of y when x is 0 and the slope of the line
3 3
By specifying the coordinates of two points on the line
For graphics, we usually specify the endpoints
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
15
Polygons
Any figure with straight can sides be specified by giving the coordinates of all the vertexes 3 For a rectangle that is aligned with the screen axes, you only need two points
3
This also works for shapes which can be derived from a rectangular bounding box
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
16
Curved Figures
For a shape with a curved outline, you need to specify the surface with an equation of some kind 3 Examples
3
ellipses (circles)
3
More complicated figures may need segments from multiple curves
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
17
Ellipse
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
18
Consider the circle
3
Circle centered at origin with radius R is defined by
x2 + y2 = R2
If we solve this to get y in terms of x, there are two values of y for each x 3 Use a parametric equation instead
3
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
19
Parametric Equation
Parametric equation expresses each coordinate in terms of a parameter x = f(t) y = g(t) 3 The parametric equation for an ellipse is x = x0 + a cos t
3
y = y0 + b sin t
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
20
Graphing a Spirograph
The parametric equation for a spirograph is
x = (r1 + r2) cos t - p cos ((r1 + r2) t / r2) y = (r1 + r2) cos t - p cos ((r1 + r2) t / r2)
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
21
The Shape Interface
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
22
Methods in the Shape Interface
boolean contains( ...) 4 versions Rectangle2D getBounds() PathIterator getPathIterator() boolean intersects( ...) 2 versions
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
23
Provided Shapes
3 3 3 3
Line Rectangle Round rectangle Ellipse
3 3 3 3
Arc Quadratic curve Cubic curve Polygon
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
24
Rectangular Shapes
Rectangle, Rectangle2D, Ellipse2D, Arc2D, RoundedRectangle2D 3 Specify the position of the upper-left corner of the bounding box followed by the width and height.
3
For Arc2d, also need starting angle and the angle it spans For RoundedRectangle2D, need a width and height for the arcs at the corners
Zhang & Liang, Computer Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved.
25
Polygons
3A
polygon is a closed figure which is defined by a sequence of points called vertexes. an empty Polygon with Polygon poly = new Polygon()
3 Create
3 Add
vertexes using
poly.addPoint( x, y);
3 Use
the Graphics2D drawn and fill methods to display the Polygon g.draw( poly); g.fill( &poly) Graphics Using Java 2D and 3D (c) 2007 Pearson Education, Inc. All rights reserved. Zh...