Graphics in Java
Part II
Lecture Objectives
• Learn how to use Graphics in Java
Lecture Objectives
• Outline:
Introduction
Graphics Contexts and Graphics Objects
Color Control
Font Control
Drawing Lines, Rectangles and Ovals
Drawing Arcs
Drawing Polygons and Polylines
The Java2D API
Java2D Shapes
Introduction
• In this lecture, we will learn about:
 Drawing 2D shapes.
 Using colors.
 Using fonts.
• Java Graphics Support:
 Has a class hierarchy for its graphics classes and 2D
API classes
• Java Coordinate System:
 (x, y) pairs
• x - horizontal axis
• y - vertical axis
 Upper left corner is (0,0)
 Coordinates measured in Pixels (Picture Element Smallest unit of resolution)
Graphics Context and Objects
• Graphics context
 Enables drawing on screen
 Graphics object manages graphics context
• Controls how information is drawn
• Has methods for drawing, font manipulation, etc
 Graphics an abstract class!
• Cannot instantiate objects
• Implementation hidden - more portable
• Class Component
 Superclass for many classes in java.awt package
 Method paint() takes Graphics object as argument
Graphics Context and Objects (Cont’d)
• Class Component (Cont’d)
 paint() often called in response to an event
 repaint() calls update(), which forces a paint()
operation
• update() rarely called directly!
• Sometimes overridden to reduce "flicker"
Headers:
public void repaint()
public void update( Graphics g )
• In this lecture:
 Focus on paint() method
Color Control
• Class Color
 Defines methods and constants for manipulating colors
 Colors created from red, green, and blue (RGB) components
• RGB value: 3 integers from 0 to 255 each, or three
floating point values from 0 to 1.0 each
• Larger the value, more of that color
 Color methods getRed(), getGreen(), getBlue() return
an integer between 0 and 255 representing amount
 Graphics method setColor() sets drawing color
• Takes Color object
• Method getColor() gets current color setting
Color Control (Cont’d)
• Component JColorChooser
 Displays dialog allowing user to select a color
 Method showDialog()
• First argument: reference to parent Component (window
from which dialog being displayed)
– Modal dialog - user cannot interact with other dialogs while
active
• Second argument: String for title bar
• Third argument: Initial selected color
• Returns a Color object
• Class Container
 Method setBackground() - takes Color object
 Sets background color
Color Control (Cont’d)
JColorChooser
Color Control (Cont’d)
Outline:
import java.awt.*;
import javax.swing.*;
import java.awt.event.*;
public class ShowColors extends Jframe {
public ShowColors() {
super( "Using colors" );
setSize( 400, 130 );
show();
}
public void paint( Graphics g ) {
// set new drawing color using integers
g.setColor( new Color( 255, 0, 0 ) );
g.fillRect( 25, 25, 100, 20 );
g.drawString( "Current RGB: " + g.getColor(), 130, 40 );
// set new drawing color using floats
g.setColor( new Color( 0.0f, 1.0f, 0.0f ) );
g.fillRect( 25, 50, 100, 20 );
g.drawString( "Current RGB: " + g.getColor(), 130, 65 );
import
Class definition
define paint()
Color Control (Cont’d)
Outline:
// set new drawing color using static Color objects
g.setColor( Color.blue );
g.fillRect( 25, 75, 100, 20 );
g.drawString( "Current RGB: " + g.getColor(), 130, 90 );
define paint()
// display individual RGB values
Color c = Color.magenta;
g.setColor( c );
g.fillRect( 25, 100, 100, 20 );
g.drawString( "RGB values: " + c.getRed() + ", " +
c.getGreen() + ", " + c.getBlue(), 130, 115 );
}
public static void main( String args[] ) {
ShowColors app = new ShowColors();
main() method
}
}
Program Output
Font Control
• Class Font
 Constructor takes three arguments
public Font( String name, int style, int size)
• name: any font supported by system (Serif,
Monospaced)
• style: constants FONT.PLAIN, FONT.ITALIC,
FONT.BOLD
– Combinations: FONT.ITALIC + FONT.BOLD
• size: measured in points (1/72 of an inch)
 Use similar to Color
 g.setFont( fontObject );
Font Control (Cont’d)
• Methods









getStyle()
getSize()
getName()
getFamily()
isPlain()
isBold()
isItalic()
getFont()
setFont(Font f)
Font Control (Cont’d)
• Class FontMetrics
 Has methods for getting font metrics
 g.getFontMetrics() - returns FontMetrics
object
height
Xy1
leading
ascent
baseline
descent
Font Control (Cont’d)
• FontMetrics (and Graphics) methods






getAscent()
getDescent()
getLeading()
getHeight()
getFontMetrics()
getFontMetrics( Font f )
Font Control (Cont’d)
Outline:
import java.awt.*;
import javax.swing.*;
import java.awt.event.*;
public class Fonts extends Jframe {
public Fonts() {
super( "Using fonts" );
setSize( 420, 125 );
show();
}
public void paint( Graphics g ) {
// set current font to Serif (Times), bold, 12pt
// and draw a string
g.setFont( new Font( "Serif", Font.BOLD, 12 ) );
g.drawString( "Serif 12 point bold.", 20, 50 );
// set current font to Monospaced (Courier),
// italic, 24pt and draw a string
g.setFont( new Font( "Monospaced", Font.ITALIC, 24 ) );
g.drawString( "Monospaced 24 point italic.", 20, 70 );
import
Class definition
define paint()
Font Control (Cont’d)
Outline:
// set current font to SansSerif (Helvetica),
// plain, 14pt and draw a string
g.setFont( new Font( "SansSerif", Font.PLAIN, 14 ) );
g.drawString( "SansSerif 14 point plain.", 20, 90 );
define paint()
// set current font to Serif (times), bold/italic,
// 18pt and draw a string
g.setColor( Color.red );
g.setFont(new Font( "Serif", Font.BOLD + Font.ITALIC, 18 ) );
g.drawString( g.getFont().getName() + " " +
g.getFont().getSize() +
" point bold italic.", 20, 110 );
}
public static void main( String args[] ) {
Fonts app = new Fonts();
}
main() method
}
Program Output
Font Control (Cont’d)
Outline:
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
public class Metrics extends JFrame {
public Metrics() {
super( "Demonstrating FontMetrics" );
setSize( 510, 210 );
show();
}
public void paint( Graphics g ) {
g.setFont( new Font( "SansSerif", Font.BOLD, 12 ) );
FontMetrics fm = g.getFontMetrics();
g.drawString( "Current font: " + g.getFont(), 10, 40 );
g.drawString( "Ascent: " + fm.getAscent(), 10, 55 );
g.drawString( "Descent: " + fm.getDescent(), 10, 70 );
g.drawString( "Height: " + fm.getHeight(), 10, 85 );
g.drawString( "Leading: " + fm.getLeading(), 10, 100 );
import
Class definition
define paint()
Font Control (Cont’d)
Outline:
Font font = new Font( "Serif", Font.ITALIC, 14 );
fm = g.getFontMetrics( font );
g.setFont( font );
g.drawString( "Current font: " + font, 10, 130 );
g.drawString( "Ascent: " + fm.getAscent(), 10, 145 );
g.drawString( "Descent: " + fm.getDescent(), 10, 160 );
g.drawString( "Height: " + fm.getHeight(), 10, 175 );
g.drawString( "Leading: " + fm.getLeading(), 10, 190 );
}
public static void main( String args[] )
Metrics app = new Metrics();
}
}
define paint()
{
main() method
Program Output
Drawing Lines, Rectangles and Ovals
• Graphics methods for drawing shapes:
 drawLine(x1, y1, x2, y2)
• Line from x1, y1 to x2, y2
 drawRect(x1, y1, width, height)
• Draws rectangle with upper left corner x1, y1
 fillRect(x1, y1, width, height)
• As above, except fills rectangle with current color
 clearRect(x1, y1, width, height)
• As above, except fills rectangle with background color
 draw3DRect(x1, y1, width, height, isRaised)
• Draws 3D rectangle, raised if isRaised is true,
else lowered.
Drawing Lines, Rectangles and Ovals (Cont’d)
• Graphics methods for drawing shapes (Cont’d)
 fill3DRect
• As previous, but fills rectangle with current color
 drawRoundRect(x, y, width, height, arcWidth,
arcHeight)
• Draws rectangle with rounded corners. See diagram next
slide.
 fillRoundRect(x, y, width, height, arcWidth,
arcHeight)
 drawOvalx, y, width, height)
• Draws oval in bounding rectangle (see diagram)
• Touches rectangle at midpoint of each side
 fillOval(x, y, width, height)
Drawing Lines, Rectangles and Ovals (Cont’d)
(x, y)
drawRoundRect() parameters
arc height
arc width
height
width
(x, y)
drawOval() parameters
height
width
Drawing Lines, Rectangles and Ovals (Cont’d)
Outline:
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import
public class LinesRectsOvals extends JFrame {
private String s = "Using drawString!";
public LinesRectsOvals() {
super( "Drawing lines, rectangles and ovals" );
setSize( 400, 165 );
show();
}
public void paint( Graphics g ) {
g.setColor( Color.red );
g.drawLine( 5, 30, 350, 30 );
g.setColor( Color.blue );
g.drawRect( 5, 40, 90, 55 );
g.fillRect( 100, 40, 90, 55 );
g.setColor( Color.cyan );
g.fillRoundRect( 195, 40, 90, 55, 50, 50 );
g.drawRoundRect( 290, 40, 90, 55, 20, 20 );
Class definition
define paint()
Drawing Lines, Rectangles and Ovals (Cont’d)
Outline:
g.setColor( Color.yellow );
g.draw3DRect( 5, 100, 90, 55, true );
g.fill3DRect( 100, 100, 90, 55, false );
define paint()
g.setColor( Color.magenta );
g.drawOval( 195, 100, 90, 55 );
g.fillOval( 290, 100, 90, 55 );
}
public static void main( String args[] ) {
LinesRectsOvals app = new LinesRectsOvals();
}
main() method
}
Program Output
Drawing Arcs
• Arc
 Portion of an oval
 Measured in degrees
• Starts at a starting angle and sweeps the number of
degrees specified by arc angle
• Positive - counterclockwise
• Negative - clockwise
 When drawing an arc, specify bounding rectangle for an
oval
 drawArc(x, y, width, height, startAngle,
arcAngle)
 fillArc - as above, but draws a solid arc (sector)
Drawing Arcs (Cont’d)
Outline:
import java.awt.*;
import javax.swing.*;
import java.awt.event.*;
public class DrawArcs extends Jframe {
public DrawArcs() {
super( "Drawing Arcs" );
setSize( 300, 170 );
show();
}
public void paint( Graphics g ) {
// start at 0 and sweep 360 degrees
g.setColor( Color.yellow );
g.drawRect( 15, 35, 80, 80 );
g.setColor( Color.black );
g.drawArc( 15, 35, 80, 80, 0, 360 );
// start at 0 and sweep 110 degrees
g.setColor( Color.yellow );
g.drawRect( 100, 35, 80, 80 );
g.setColor( Color.black );
g.drawArc( 100, 35, 80, 80, 0, 110 );
import
Class definition
define paint()
Drawing Arcs (Cont’d)
// start at 0 and sweep -270 degrees
g.setColor( Color.yellow );
g.drawRect( 185, 35, 80, 80 );
g.setColor( Color.black );
g.drawArc( 185, 35, 80, 80, 0, -270 );
// start at 0 and sweep 360 degrees
g.fillArc( 15, 120, 80, 40, 0, 360 );
// start at 270 and sweep -90 degrees
g.fillArc( 100, 120, 80, 40, 270, -90 );
// start at 0 and sweep -270 degrees
g.fillArc( 185, 120, 80, 40, 0, -270 );
}
public static void main( String args[] ) {
DrawArcs app = new DrawArcs();
}
Outline:
define paint()
main() method
}
Program Output
Drawing Polygons and Polylines
• Polygon - multisided shape
• Polyline - series of connected points
• Methods of class Polygon
 drawPolygon(xPoints[], yPoints[], points)
• Draws a polygon, with x and y points specified in
arrays. Last argument specifies number of points
• Closed polygon, even if last point different from first
 drawPolyline(xPoints[], yPoints, points)
• As above, but draws a polyline
• Open polyline
Drawing Polygons and Polylines (Cont’d)
• Methods of class Polygon
 drawPolygon(myPolygon)
• Draws specified closed polygon
 fillPolygon(xPoints[], yPoints[], points)
• Draws a solid polygon
 fillPolygon(myPolygon)
• Draws specified solid polygon
 Polygon(xValues[], yValues[], numberOfPoints)
• Constructs a new polygon object
 myPolygon.addPoint(x, y)
• Add pairs of x-y coordinates to polygon object
Drawing Polygons and Polylines (Cont’d)
Outline:
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
public class DrawPolygons extends Jframe {
public DrawPolygons() {
super( "Drawing Polygons" );
setSize( 275, 230 );
show();
}
public void paint( Graphics g ) {
int xValues[] = { 20, 40, 50, 30, 20, 15 };
int yValues[] = { 50, 50, 60, 80, 80, 60 };
Polygon poly1 = new Polygon( xValues, yValues, 6 );
g.drawPolygon( poly1 );
int xValues2[] = { 70, 90, 100, 80, 70, 65, 60 };
int yValues2[] = { 100, 100, 110, 110, 130, 110, 90 };
g.drawPolyline( xValues2, yValues2, 7 );
int xValues3[] = { 120, 140, 150, 190 };
int yValues3[] = { 40, 70, 80, 60 };
g.fillPolygon( xValues3, yValues3, 4 );
Import
Class definition
define paint()
Drawing Polygons and Polylines (Cont’d)
Polygon poly2 = new Polygon();
poly2.addPoint( 165, 135 );
poly2.addPoint( 175, 150 );
poly2.addPoint( 270, 200 );
poly2.addPoint( 200, 220 );
poly2.addPoint( 130, 180 );
Outline:
define paint()
g.fillPolygon( poly2 );
}
public static void main( String args[] ) {
DrawPolygons app = new DrawPolygons();
}
main() method
}
Program Output
Java2D API
• Java2D API
 Advanced two dimensional graphics capabilities
 Too many capabilities to cover (for overview, see demo)
• Drawing with Java2D API
 Use instance of class Graphics2D (package java.awt)
• Subclass of Graphics
• Has all graphics capabilities we have previously
discussed
 Must downcast Graphics reference passed to paint
Graphics2D g2d = (Graphics2D) g;
 This technique used in programs of next section
Java2D Shapes
• Sample methods from Graphics2D
 setPaint(paintObject)
• Paint object is an object of a class that implements
java.awt.Paint
• Can be an object of class Color, GradientPaint,
SystemColor, TexturePaint
 GradientPaint(x1, y1, color1, x2, y2,
color2, cyclic)
• Creates a gradient (slowly changing color) from x1, y1,
to x2, y2, starting with color1 and changing to color2
• If cyclic true, then cyclic gradient (keeps
transitioning colors)
– If acyclic, only transitions colors once
Java2D Shapes (Cont’d)
• Sample methods from Graphics2D
 fill ( shapeObject )
• Draws a filled Shape object
• Instance of any class that implements Shape
(java.awt)
• Ellipse2D.Double, Rectangle2D.Double
• Double-precision inner classes of Ellipse2D
 setStroke( strokeObject )
• Set a shape's borders
• Instance of a class that implements Stroke
(java.awt)
• BasicStroke( width ) - One of many
constructors
– This constructor specifies width in pixels of border
Java2D Shapes (Cont’d)
• Sample methods from Graphics2D
 draw (shapeObject)
• Draws specified Shape object
 Class BufferedImage
• Can produce images in color or grayscale
• Can create patterns by drawing into the
BufferedImage object
 Class TexturePaint
• Constructor can take BufferedImage and shape to
fill
• Object of class TexturePaint then drawn using
setPaint()
Java2D Shapes (Cont’d)
• Class Arc2D.Double
 Similar to normal arcs, except has another argument at
end
• Arc2D.PIE - close arc with two lines
• Arc2D.CHORD - draws line from endpoints of arc
• Arc2D.OPEN - arc not closed
• Class BasicStroke
 Can be used to create customized dashed lines, set how
lines end and join
Java2D Shapes (Cont’d)
• Class GeneralPath
 A general path is a shape made from lines and curves
 Method moveTo()
• Specifies first point in a general path
 Method lineTo()
• Draws a line to next point in general path
 Method closePath()
• Draws line from last point to point specified in last call
to moveTo()
Java2D Shapes (Cont’d)
• Other methods
 rotate(radians) - rotate next shape around
origin
 translate(x, y) - translates origin to x, y
Java2D Shapes (Cont’d)
import javax.swing.*;
import java.awt.event.*;
import java.awt.*;
import java.awt.geom.*;
import java.awt.image.*;
public class Shapes extends Jframe {
public Shapes() {
super( "Drawing 2D shapes" );
setSize( 425, 160 );
show();
}
public void paint( Graphics g ) {
// create 2D by casting g to Graphics2D
Graphics2D g2d = ( Graphics2D ) g;
// draw 2D ellipse filled with a blue-yellow gradient
g2d.setPaint(
new GradientPaint( 5, 30,
// x1, y1
Color.blue, // initial Color
35, 100,
// x2, y2
Color.yellow, // end Color
true ) );
// cyclic
g2d.fill( new Ellipse2D.Double( 5, 30, 65, 100 ) );
Outline:
import
Class definition
define paint()
Cast to
Graphics2D
Java2D Shapes (Cont’d)
// draw 2D rectangle in red
g2d.setPaint( Color.red );
g2d.setStroke( new BasicStroke( 10.0f ) );
g2d.draw(new Rectangle2D.Double( 80, 30, 65, 100 ) );
// draw 2D rounded rectangle with a buffered background
BufferedImage buffImage =
new BufferedImage(10, 10, BufferedImage.TYPE_INT_RGB );
Graphics2D gg = buffImage.createGraphics();
gg.setColor( Color.yellow ); // draw in yellow
gg.fillRect( 0, 0, 10, 10 ); // draw a filled rectangle
gg.setColor( Color.black ); // draw in black
gg.drawRect( 1, 1, 6, 6 ); // draw a rectangle
gg.setColor( Color.blue ); // draw in blue
gg.fillRect( 1, 1, 3, 3 ); // draw a filled rectangle
gg.setColor( Color.red ); // draw in red
gg.fillRect( 4, 4, 3, 3 ); // draw a filled rectangle
// paint buffImage onto the JFrame
g2d.setPaint(new TexturePaint(buffImage, new Rectangle( 10, 10 ) ) );
g2d.fill(new RoundRectangle2D.Double(155, 30, 75, 100, 50, 50 ) );
// draw 2D pie-shaped arc in white
g2d.setPaint( Color.white );
g2d.setStroke( new BasicStroke( 6.0f ) );
g2d.draw(new Arc2D.Double(240, 30, 75, 100, 0, 270, Arc2D.PIE ) );
Outline:
paint()
Program Output
Java2D Shapes (Cont’d)
Code available on WebCT – Shapes2.java
Outline:
Program Output