Complex shapes

1
 Objectives
• To understand the architecture and operations of a 2D
graphics system
• To understand 2D coordinate systems and equations of
graphs
• To be able to identify the various coordinate spaces in a
rendering pipeline
• To understand Java 2D program structure and the
Graphics2D object
• To graph equations with Java programs
• To use basic 2D geometric primitives
• To construct custom shapes using GeneralPath class
• To construct geometric shapes through constructive area
geometry 2
Draw Shapes
• Graphic2D contains draw(Shape s) and fill(Shape s)
methods that draws the outline of the shape or fills
the interior of the shape
• Java 2D provides facilities to construct basic shapes
and to combine them to form more complex shapes
• The basic shapes are:
• Line • Arc
• Rectangle • Quadratic curve
• Round rectangle • Cubic curve
• Ellipse • Polygon

3
The Shape Interface
Shape

RectangularShape Arc2D [Link]

[Link]
Polygon

Ellipse2D [Link]
Rectangle

[Link]
Area

Rectangle2D [Link]
GeneralPath

[Link]

RoundRectangle2D [Link]

[Link]
Line2D [Link]

[Link]

QuadCurve2D [Link]

[Link] 4
CubicCurve2D [Link]

[Link]
 Line Shape
▪ To create a Line2D object with double data type,
the following is used

Line2D line = new [Link](x1, y1, x2, y2);

Example: Draw a line from (10,10) to

(200,200)

public void paintComponent(Graphics g) {

[Link](g);
Graphics2D g2 = (Graphics2D)g;
Line2D line = new [Link](10,
10, 200, 200);
[Link](line); 5
}
Curves
• In addition to lines and piecewise linear polylines, curves are
also common in computer graphics.
• curves are defined as parametric polynomials
that can also be attached to each other like lines in a polyline.
• In addition to the endpoints of the curve, one or
more control points have to be specified. Usually, two control
points are used leading to a cubic curve or only one control
point is used in order to define a quadratic curve.
• The control points define the direction of the curve in the two
endpoints.

6
 Quadratic curve Shapes
• QuadCurve2D represents a quadratic curve, defined by three
points
• The first and last control points are the endpoints of the curve
• The middle control point usually is not on the curve but
instead defines the trend of the quadratic curve
QuadCurve2D quad = new [Link](x1, y1, x2, y2, x3,y3)

Example:

public void paintComponent(Graphics g) {

[Link](g);
Graphics2D g2 = (Graphics2D)g;
QuadCurve2D c = new
[Link](10, 10, 300,50, 200,
200); 7
[Link](c);
}
 Cubic Bezier curve Shapes
• CubicCurve2D represents a cubic Bezier curve, defined by four control points
• The first and last control points are the endpoints of the curve
• The middle two control points usually is not on the curve but instead defines the
shape of the curve
CubicCurve2D cubic = new [Link](x1, y1, x2, y2, x3, y3, x4, y4);

Example:
public void paintComponent(Graphics g) {
[Link](g);
Graphics2D g2 = (Graphics2D)g;
CubicCurve2D cu = new
[Link](50, 50,100,300, 150,50,
200, 200); 8
[Link](cu);

}
Rectangle Shapes
▪ Rectangle2D ri = new Rectangle2D(x1, y1, W, L);
The upper Left corner of rectangle (x1, y1)
W: the width of the rectangle and
L: the length of the rectangle

▪ Rectangle2D ri = new [Link](x1, y1, W,

L);
▪ Rectangle2D ri = new [Link](x1, y1, W, L);
▪ RoundRectangle2D rrect = new RoundRectangle2D.
Double(x1, y1, W, L, d1, d2);
d1 and d2 are dimension of the arc
9
Rectangle Shapes
Example:
public void paintComponent(Graphics g) {
[Link](g);
Graphics2D g2 = (Graphics2D)g;
Rectangle2D ri = new Rectangle(20, 30,100,80);
Rectangle2D rd = new [Link](200.0,
30.0,100.0,80.0);
Rectangle2D rf = new [Link](20f, 150f,100f,80f);
RoundRectangle2D rrect = new
[Link](200.0, 150.0,100.0,80.0,25.0,25.0);
[Link](ri);
[Link](rf);
[Link]([Link]);
[Link](rd);
[Link](rrect);
}

10
Ellipse Shapes
▪ Ellipse2D represents a full ellipse
▪ The parametric equation of the ellipse centered at the origin can be written as
x=a cosƟ
y=a sinƟ

▪ The location and size of an Ellipse2D object are specified using its bounding rectangle
Ellipse2D ellipse = new [Link](x1, y1, W, L)
(x1, y1): the upper left corner of the bounding rectangle
W and L: the dimension of a rectangle

▪ Arc2D defines an elliptic arc. The portion of the arc is defined be a range on the 11
parameter Ɵ
▪ Arc2D defines three ways to close an arc: OPEN, CHORD, PIE
Arc2D arc = new [Link](x1, x2, W, L, Ɵ1, Ɵ2, [Link]);
 Ellipse Shapes
Example:
public void paint(Graphics g) {
Graphics2D g2d = (Graphics2D) g;
Arc2D arc = new [Link](50, 50, 100, 50, 0, 90, [Link]);
Arc2D arc1 = new [Link](200, 50, 100, 50, 10, 160,
[Link]);
Arc2D arc2 = new [Link](50, 200, 100, 50, 30, 300, [Link]);
Ellipse2D ellipse = new [Link](200f, 200f, 100f, 80f);
[Link](arc);
[Link]([Link]);
[Link](arc1);
[Link]([Link]);
[Link](arc2);
[Link]([Link]);
[Link](ellipse);
}

12
 Polygon Shape
To Draw the polygon, the following can be used
Polygon poly = new Polygon(xPoly, yPoly, [Link]);

Example:
public void paint(Graphics g) {
Graphics2D g2d = (Graphics2D) g;
int xPoly[] = {150,250,325,375,450,275,100};
int yPoly[] = {150,100,125,225,250,375,300};
Polygon poly = new Polygon(xPoly, yPoly,
[Link]);
[Link]([Link]);
[Link](poly);
}
13
 Constructive Area Geometry
• Combining several existing shapes is known as constructive area
geometry
• The class Area is designed to perform constructive area geometry:
union, intersection, difference, and symmetric difference
• The area object can be constructed from any Shape object using
the following constructor
• Area(Shape s)
• Set-theoretic operations
• void Intersect (Area a)
• void Add(Area a)
Subtractio
• void Subtract (Area a) Union
n
• void Exclusiveor (Area a)

Exclusive-
Intersection 14
or (XOR)
 Example
public void paintComponent(Graphics g){ a1 = new Area(s1);
[Link](g); [Link](a2)
Graphics g2=(Graphics)g; [Link](a1);
Shape S1=new [Link](0, 0, 100, 100); [Link](180, 0);
Shape S1=new [Link](60, 0, 100, 100); a1 = new Area(s1);
Area a1; [Link](a2);
Area a2= new Area(s2); [Link](a1);}
[Link](20,50);
[Link](s1);
[Link](s2);
[Link](0, 200);
Area a1= new Area(s1);
[Link](a2);
[Link](a1);
[Link](180, 0); 15
Output

16
GeneralPath
• The Graphic2D engine internally uses five basic types of
curve segments or operations to render the borders of
any shape
• PathIterator interface defines the five segment
constants
• SEG_MOVETO
• SEG_LINETO
• SEG_QUADTO
• SEG_CUBICTO
• SEG_CLOSE

17
 GeneralPath
• GeneralPath methods

• void moveTo(float x, float y): moves the pen to the new location (x, y) without
drawing anything

• void lineTo(float x, float y): draws a line from the current location to the point (x, y),
and the pen takes the new point as current location.

• void quadTo(float x1, float y1, float x2, float y2): draws a quadratic curve to (x2,y2)
using (x1, y1) as middle control point.

• Void curveTo(float x1, float y1, float x2, float y2, float x3, float y3): draws a cubic
curve from the current point to (x3, y3) using (x1, y1) and (x2, y2) as its two middle
control points

• Void closePath(): draw a line back to the point defined by the last moveTo .

18
Example
GeneralPath path=new GeneralPath()
[Link](-2f,0f);
[Link](0f, 2f, 2f, 0f);
[Link](0f, -2f, -2f, 0f);
[Link](-1f, 0.5f);
[Link](-1f, -0.5f);
[Link](1f, 0.5f);
[Link](1f, -0.5f);
[Link]();

19
Exercise
• Try developing the following shape using Java2D

20
answer
• GeneralPath gp = new GeneralPath();
//Start at the lower left corner of the car
[Link](60,120);
[Link](80,120); //front underbody
[Link](90,140,100,120); //front wheel
[Link](160,120); //middle underbody
[Link](170,140,180,120); //rear wheel
[Link](200,120); //rear underbody
[Link](195,100,200,80,160,80); //rear
[Link](110,80); //roof
[Link](90,100); //windscreen
[Link](60,100); //bonnet
[Link](60,120); //front
[Link](gp); //Draw the car
21