Chapter 15Java: an Introduction to Computer Science & Programming - Walter Savitch 1 Chapter 15 l...
-
Upload
barbra-claire-perry -
Category
Documents
-
view
215 -
download
1
Transcript of Chapter 15Java: an Introduction to Computer Science & Programming - Walter Savitch 1 Chapter 15 l...
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 1
Chapter 15
Basic Figures Colors Fonts and Other Text Details
Graphics Objects
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 2
Earlier chapters explain how to make graphical user interfaces (GUIs).
This chapter explains a different way of using graphics in Java: drawing pictures.
We will learn how to basic figures such as lines, ovals, and rectangles.
Basic figures can be combined to create elaborate pictures.
An optional section explains how to draw polygons.
Basic Figures
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 3
Screen Coordinate System
(0, 0)
origin
Y-coordinate is positive and increasing in the downward direction.
X-coordinate is positive and increasing to the right.
All coordinates are normally positive.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 4
Screen Coordinate System
(100, 75)
(0, 0)
origin
X-coordinate:100 pixels from left edge of screen
Y-coordinate:75 pixels from top edge of screen
Location of a rectangle is specified by coordinates of upper left corner.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 5
Screen Coordinate System
(100, 75)
(0, 0)
origin
Location of an oval is specified by a tightly fitting rectangle.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 6
The paint Method
Most Swing and Swing related components have a method named paint.
The paint method draws the component on the screen.
To draw basic figures such as ovals and rectangles, you need to redefine the paint method.
The paint method is called automatically and should not be invoked in the programmer’s code.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 7
public void paint(Graphics g)
{
super.paint(g);
g.drawOval(X_FACE, Y_FACE, FACE_DIAMETER, FACE_DIAMETER);
//Draw Nose:
g.fillOval(X_NOSE, Y_NOSE, NOSE_DIAMETER, NOSE_DIAMETER);
//Draw Eyes:
g.fillOval(X_LEFT_EYE, Y_LEFT_EYE, EYE_WIDTH, EYE_HEIGHT);
g.fillOval(X_RIGHT_EYE, Y_RIGHT_EYE, EYE_WIDTH, EYE_HEIGHT);
//Draw eyebrows:
g.drawLine(X1_LEFT_BROW, Y1_LEFT_BROW,
X2_LEFT_BROW, Y2_LEFT_BROW);
g.drawLine(X1_RIGHT_BROW, Y1_RIGHT_BROW,
X2_RIGHT_BROW, Y2_RIGHT_BROW);
//Draw Mouth:
g.drawArc(X_MOUTH, Y_MOUTH, MOUTH_WIDTH, MOUTH_HEIGHT,
MOUTH_START_ANGLE, MOUTH_ARC_SWEEP);
}
The complete paint method from Madeleine.java
The program draws this picture.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 8
public void paint(Graphics g)
{
super.paint(g);
g.drawOval(X_FACE, Y_FACE, FACE_DIAMETER, FACE_DIAMETER);
//Draw Nose:
g.fillOval(X_NOSE, Y_NOSE, NOSE_DIAMETER, NOSE_DIAMETER);
//Draw Eyes:
g.fillOval(X_LEFT_EYE, Y_LEFT_EYE, EYE_WIDTH, EYE_HEIGHT);
g.fillOval(X_RIGHT_EYE, Y_RIGHT_EYE, EYE_WIDTH, EYE_HEIGHT);
//Draw eyebrows:
g.drawLine(X1_LEFT_BROW, Y1_LEFT_BROW,
X2_LEFT_BROW, Y2_LEFT_BROW);
g.drawLine(X1_RIGHT_BROW, Y1_RIGHT_BROW,
X2_RIGHT_BROW, Y2_RIGHT_BROW);
//Draw Mouth:
g.drawArc(X_MOUTH, Y_MOUTH, MOUTH_WIDTH, MOUTH_HEIGHT,
MOUTH_START_ANGLE, MOUTH_ARC_SWEEP);
}
The face, nose, and eyes are ovals. The eyebrows are lines, and the mouth is an arc.
The method for drawing each shape has numeric parameters telling where to draw the shape and how big to make it.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 9
public void paint(Graphics g)
{
super.paint(g);
g.drawOval(X_FACE, Y_FACE, FACE_DIAMETER, FACE_DIAMETER);
//Draw Nose:
g.fillOval(X_NOSE, Y_NOSE, NOSE_DIAMETER, NOSE_DIAMETER);
//Draw Eyes:
g.fillOval(X_LEFT_EYE, Y_LEFT_EYE, EYE_WIDTH, EYE_HEIGHT);
g.fillOval(X_RIGHT_EYE, Y_RIGHT_EYE, EYE_WIDTH, EYE_HEIGHT);
//Draw eyebrows:
g.drawLine(X1_LEFT_BROW, Y1_LEFT_BROW,
X2_LEFT_BROW, Y2_LEFT_BROW);
g.drawLine(X1_RIGHT_BROW, Y1_RIGHT_BROW,
X2_RIGHT_BROW, Y2_RIGHT_BROW);
//Draw Mouth:
g.drawArc(X_MOUTH, Y_MOUTH, MOUTH_WIDTH, MOUTH_HEIGHT,
MOUTH_START_ANGLE, MOUTH_ARC_SWEEP);
}
The paint method receives one parameter, which is an object of the Graphics class.
The Graphics parameter is the calling object for all of the methods that draw lines and shapes.
Calling the paint method of the parent class is a good programming practice.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 10
The Graphics class
Contains methods used to draw basic shapes and lines Is part of the AWT package (or library) so the AWT must be
imported:
import java.awt.*; Most methods for painting shapes have two versions:
» A draw version which only draws the outline of the shape
drawOval» A fill version which fills in the shape
fillOval
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 11
Drawing Rectangles and Ovals
(100, 120)
(0, 0)
g.fillOval(100, 120, 40, 20);
(100, 50)
width
height40
20
Graphics object
20
40
g.fillRect(100, 50, 40, 20);
X and Y coordinates of upper left corner
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 12
Drawing Arcs
An arc is specified by giving an oval and then specifying what portion of the oval will be used for the arc.
To tell which part of the oval will be used, specify the beginning angle and the degrees of the sweep.
positive direction
0 degrees
width
height
(x,y)
gdrawArc(x, y, width, height, 0, 360);
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 13
Arc Examples
positive direction
0 degrees
negative direction
0 degrees
180 degrees
gdrawArc(x, y, width, height, 0, -90);
gdrawArc(x, y, width, height, 0, 360);
gdrawArc(x, y, width, height, 0, 90);
gdrawArc(x, y, width, height, 180, 90);
plus 90 degrees
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 14
Round Rectangles
Round rectangle is a rectangle where corners have been replaced with arcs.
Specify by giving rectangle information and then height and width of corner arcs.
arcWidth
width
height
(x,y)
gdrawRoundRect(x, y, width, height, arcWidth, arcHeight);
arcHeight
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 15
Polygons
drawPolygon allows a program to draw shapes with any number of sides.
public void drawPolygon(int[] x, int[] y, int point)
Each point in the polygon will have an x coordinate from the first parameter and a y coordinate from the corresponding element of the second parameter.
The third parameter tells how many points the polygon will have. Always draws a closed polygon. If first and last points are not equal,
draws a line from last to first. drawPolyline is similar but can draw an open figure. fillPolygon is similar but fills with color instead of drawing outline.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 16
Action Drawings and repaint
The SadMadeleine program demonstrates how a program can change a picture.
In the original picture, the face has a frown. When the user clicks on the button, the picture changes to a
smiling face and moves up on the screen.
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 17
Action Drawings and repaint
The actionPerformed method changes the smile variable that the paint method uses.
When the smile variable is changed to true, the paint method knows to draw a smile instead of a frown.
public void actionPerformed(ActionEvent e)
{
if (e.getActionCommand().equals("Click for a Smile."))
smile = true;
else
System.out.println("Error in button interface.");
repaint();
}
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 18
Action Drawings and repaint Unless the repaint method is called, the change will not be
shown on screen. The repaint method calls paint to update the picture. The paint methd should not be called directly.
public void actionPerformed(ActionEvent e)
{
if (e.getActionCommand().equals("Click for a Smile."))
smile = true;
else
System.out.println("Error in button interface.");
repaint();
}
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 19
Colors
Draw and fill methods like fillOval will use the current color. You can use the setColor method of a Graphics object to
change the current color. To draw a red mouth you could change the paint method of the
Madeleine program to include these lines:
//Draw Mouth:
g.setColor(Color.red);
g.drawArc(X_MOUTH, Y_MOUTH, MOUTH_WIDTH, MOUTH_HEIGHT,
MOUTH_START_ANGLE, MOUTH_ARC_SWEEP);
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 20
Defining Colors
The Color class mixes amounts of red, green, and blue to produce a new color.
Since colors are made by combing different amounts of red, green, and blue, this is called the RGB color system.
The parameters to the Color constructor must be type int or float.
When integers are used as parameters to the Color constructor they should be in the range 0 to 255.
When floats are used as parameters to the Color constructor they should be in the range 0.0 to 1.0.
Color brown = new Color(204, 102, 0);
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 21
Fonts and Other Text Details
A font is a style of text. A program can use the drawString method to display text on
the screen. The first parameter tells which characters to display. The last two parameters to drawString are coordinates that
tell where on the screen to put the text.
g.drawString(theText, X_START, Y_START);
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 22
Setting the Font
The method setFont in a Graphics object can be used to change the current font.
Java guarantees that at least three fonts will be available:» Monospaced» SanSerif» Serif
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 23
Using the Font Constructor
To specify a font with a particular name, style, and size, use the Font constructor.
Size of the font is specified in points.
Each point is 1/72 of an inch, but point sizes are only approximate.
Font f = new Font(“Serif”, Font.BOLD|Font.ITALIC,
POINT_SIZE);
g.setFont(f);
Name of the font Style of the font: bold and italic
Size of the font in points (an integer)
Chapter 15 Java: an Introduction to Computer Science & Programming - Walter Savitch 24
Summary
You can draw figures such as lines, ovals, and rectangles using methods in the class Graphics.
You can specify the color of each figure drawn using the method setColor of the Graphics class.
You can define your own colors using the class Color. Colors are defined using the RGB (Red/Green/Blue) system. You can add text to a a graphics drawing by using the
Graphics method drawString. You can set the font and point size for a text written using
drawString with the Graphics method setFont.