Computer Science Notes Chapter 5 Page 1 of 9

paltryboarpigΛογισμικό & κατασκευή λογ/κού

3 Νοε 2013 (πριν από 3 χρόνια και 10 μήνες)

94 εμφανίσεις

Computer Science Notes

Chapter 5


Page
1

of
9

Chapter
5
:
Computer Graphics

Big Skill
s
:


1.

To
be able to write simple graphical applications
.

2.

To
display graphical shapes, such as lines, rectangles, and ellipses
.

3.

To
use colors
.

4.

To
display drawings consisting of many shapes
.

5.

To
read input from a dialog box
.

6.

To
develop test cases that validate the correctness of your programs
.


Section
5
.1:
Frame Windows


All graphical applications show their information inside a frame window, which is a window with a title bar.

To construct a frame, follow these steps using

these lines of codes:

1.

Construct an object of the
JFrame

class:

JFrame

frame = new JFrame();

2.

Set the size of the frame:

frame.setSize(300,400);

3.

Set the title of the frame:

frame.setTitle(“Test Picture”);

4.

Set the “default close operation”:

frame.setDefaultC
loseOperation(JFrame.EXIT_ON_CLOSE);

5.

Make the frame visible

frame.setVisible(true);

6.

Import the package
javax.swing
:

import javax.swing.*;


Computer Science Notes

Chapter 5


Page
2

of
9

Section
5
.
2
:
Drawing Shapes


To draw a shape, you have to first construct a component object, and then add that comp
onent to the frame.

To construct a new component:

1.

Define a class that extends the
JComponent
class:

public class RectangleComponentMirus extends JComponent

2.

Create a
paintComponent

method (which overrides the
JComponent

method of the same name)
; this
meth
od is called automatically when the window is shown fro the first time
:

public void paintComponent(Graphics g)
;

3.

Use a cast of the graphics parameter
g

to recover it as
Graphics2D

object:

Graphics2D g2 = (Graphics2D) g;

4.

Place drawing instructions inside the

paintComponent
method
:

g2.draw(box);



To see the component, add it to your frame:

1.

Construct a frame as stated on page 1.

2.

Construct an object of your component class:

RectangleComponentMirus component = new RectangleComponentMirus();

3.

Add the component to

the frame:

frame.add(component);

4.

Make the frame visible.


Computer Science Notes

Chapter 5


Page
3

of
9


File
Rectangle
ComponentMirus
.java

(
defines a rectangle

component
to be drawn
)

File
RectangleViewTest.java

(for viewing the rectangle in the component
definition)

import java.awt.Graphics;

import

java.awt.Graphics2D;

import java.awt.Rectangle;

import javax.swing.JComponent;


/
*

Create a new graphics component that draws two
rectangles and has inherited properties from the JComponent

class

*/

public class RectangleComponentMirus extends JComponent

{


// overrides
j
avax.swing.JComponent.paintComponent


public void paintComponent(Graphics g)


{


//Recover Graphics2D


Graphics2D g2 = (Graphics2D) g;





//Construct a rectangle and draw it


Rectangle box = new Rectangle(5, 10,
20, 30);


g2.draw(box);




//Move rectangle 15 units right and 25 units down


box.translate(15, 25);



//Draw moved rectangle


g2.draw(box);


}

}

import javax.swing.JFrame;


public class RectangleViewTest

{


public static void
main(String[] args)


{


JFrame frame = new JFrame();


final int FRAME_WIDTH = 300;


final int FRAME_HEIGHT = 400;




frame.setSize(FRAME_WIDTH, FRAME_HEIGHT);


frame.setTitle("Test Picture");


frame.setDefaultCloseOperation(


JFrame.EXIT_ON_CLOSE);





RectangleComponentMirus component = new


RectangleComponentMirus();


frame.add(component);


frame.setVisible(true);


}

}


Computer Science Notes

Chapter 5


Page
4

of
9

Advanced Topic 5.1
:
Applets


An applet is a program that runs i
nside a web browser.

To implement a graphical applet, use the same code as for implementing a component, but make the following
changes:

1.

Instead of extending the
JComponent
class, extend the
JApplet
class:

public class RectangleAppletMirus extends JApplet

2.

Instead of creating a
paintComponent

method, create a
paint

method instead:

public void paint(Graphics g);



To see the
applet
,
compile it, then put the name of the object file in an applet tag in an HTML document
:

1.

Add the following code to the body of an

HTML document
:

<applet code = “R
ectangle
Applet
Mirus
.class” width=”300” height=”400”></applet>
;



File
Rectangle
Applet
Mirus
.java

(
defines a rectangle

component
to be drawn
)

File
Rectangle
.html

(for viewing the rectangle in
a web browser
)

import java.awt.G
raphics;

import java.awt.Graphics2D;

import java.awt.Rectangle;

import javax.swing.
JApplet
;


/
*

Create a new graphics
applet

that draws two rectangles
and has inherited properties from the J
Apple
t

class

*/

public class RectangleComponentMirus extends J
Appl
e
t

{


// overrides
j
avax.swing.J
Applet.paint


public void paint
(Graphics g)


{


//Recover Graphics2D


Graphics2D g2 = (Graphics2D) g;





//Construct a rectangle and draw it


Rectangle box = new Rectangle(5, 10, 20, 30);


g2.
draw(box);




//Move rectangle 15 units right and 25 units down


box.translate(15, 25);



//Draw moved rectangle


g2.draw(box);


}

}

<html>


<head>

<title>Test Picture</title>

</head>


<body>

<p>Here is a test applet that draws rectan
gles.</p>


<applet code="RectangleAppletMirus.class" width="300"
height="400"></applet>


</body>


</html>


Computer Science Notes

Chapter 5


Page
5

of
9

Section 5.3
:
Graphical Shapes

To draw an ellipse or circle:

1.

import java.awt.geom.Ellipse2D
;

2.

Ellipse2D.Double ellipse = n
ew Ellipse2D.Double(x_tople
ft, y_topleft, width, height
);

3.

g2.draw(ellipse);

4.

Ellipse2D.Double
circle

= n
ew Ellipse2D.Double(x_topleft, y_topleft, diameter, diameter
);

5.

g2.draw(
circle
);

To draw a line:

1.

import java.awt.geom.
Line
2D
;

2.

Line2D.Double line1 = new Line2D.Double(
x_start, y_star
t, x_end, y_end
);

3.

g2.draw(
line1
);

To define a point:

1.

import java.awt.geom.
Point
2D
;

2.

Point2D.Double point1 = new Point2D.Dou
ble(x, y
);

3.

P
oints can not be drawn; they are used as alternate parameters to other shape objects:


line1.setLine(point1,point2);

To dr
aw a polygon:

1.

import java.awt.
Polygon
;

2.

Polygon
triangle
= new Polygon();

3.

Add points using the addPoint() method:

poly.addPoint(100,
0);

poly.addPoint(200
,1
0
0);

poly.addPoint(
0,1
0
0);

4.

g2.draw(
triangle
);

To draw text in a frame:

1.

g2.draw
String
(
“Hello, World!”,
x_lowerleft, y_lowerleft
);


Computer Science Notes

Chapter 5


Page
6

of
9

Section 5.4
:
Colors

To change colors right before you draw a shape:

1.

import java.awt.Color;

2.

g2.setColor(Color.PINK);

To define and use your own color object:

1.

import java.awt.Color;

2.

Color mycolor = new Color(0.1F, 0.2F, 0.3F);

3.

g2
.setColor(mycolor);

To draw a shape that is filled in with a given color:

1.

g2.fill(poly);





Predefined Colors and Their RGB Values

Color

RGB Value

(a floating point number
from 0.0 to 1.0)

Color.BLACK

0.0F, 0.0F, 0.0F

Color.WHITE

1.0F, 1.0F, 1.0F

Colo
r.RED

1.0F, 0.0F, 0.0F

Color.GREEN

0.0F, 1.0F, 0.0F

Color.BLUE

0.0F, 0.0F, 1.0F

Color.LIGHTGRAY

0.75F, 0.75F, 0.75F

Color.GRAY

0.5F, 0.5F, 0.5F

Color.DARKGRAY

0.25F, 0.25F, 0.25F

Color.YELLOW

1.0F, 1.0F, 0.0F

Color.MAGENTA

1.0F, 0.0F, 1.0F

Color
.CYAN

0.0F, 1.0F, 1.0F

Color.PINK

1.0F, 0.7F, 0.7F

Color.ORANGE

1.0F, 0.8F, 0.0F



Section 5.5
:
Drawing Complex Shapes

Graph it out, then write a new class (in a third source file) that defines all the drawing steps necessary for the
complex shape.


Sec
tion 5.6
:
Reading Text Input

To get user input through a dialog box instead of from the command line:

2.

import javax.swing.JOptionPane;

3.

String input = JOptionPane.showInputDialog(“Enter a value for x:”);

4.

double x = Double.parseDouble(input);

Computer Science Notes

Chapter 5


Page
7

of
9


File
Rectangle
ComponentMirus
.java

(
now modified to draw many shapes
)

import java.awt.Graphics;

import java.awt.Graphics2D;

import java.awt.Color;

import java.awt.Rectangle;

import java.awt.Polygon;

import java.awt.geom.Ellipse2D;

import java.awt.geom.Point2D;

import ja
va.awt.geom.Line2D;

import javax.swing.JComponent;


// Create a new graphics component that draws two rectangles

// and has inherited properties from the JComponent class

public class RectangleComponentMirus extends JComponent

{


// overrides javax.swin
g.JComponent.paintComponent


public void paintComponent(Graphics g)


{



//Recover Graphics2D



Graphics2D g2 = (Graphics2D) g;






//Construct a rectangle and draw it



Rectangle box = new Rectangle(5, 10, 20, 30);



g2.draw(box);






//Move rectangle 1
5 units right and 25 units down



box.translate(15, 25);






//Draw moved rectangle



g2.draw(box);




//change the color to pink



g2.setColor(Color.PINK);



//Construct an ellipse and draw it



Ellipse2D.Double ellipse = new Ellipse2D.Double(50,50,100,5
0);



g2.draw(ellipse);






//change the color to a custom RGB color



Color mycolor = new Color(0.1F, 0.2F, 0.3F);



g2.setColor(mycolor);



//Construct a circle and draw it



ellipse.setFrame(0, 300, 75, 75);



g2.draw(ellipse);






//construct two poi
nts



//note: you can't use the draw method with a point



Point2D.Double point1 = new Point2D.Double(300,10);



Point2D.Double point2 = new Point2D.Double();




//construct a line and draw it



g2.setColor(Color.BLACK);



Line2D.Double line1 = new Line2D.
Double(0,100,200,300);



g2.draw(line1);



//change the line and draw it



line1.setLine(point1,point2);



g2.draw(line1);

Computer Science Notes

Chapter 5


Page
8

of
9



// draw a point by drawing a line with the same endpoints



point1.setLocation(150,270);



line1.setLine(point1,point1);



g2.draw(
line1);






//Construct a six
-
sided polygon



Polygon poly = new Polygon();



poly.addPoint(110,110);



poly.addPoint(210,110);



poly.addPoint(260,160);



poly.addPoint(210,210);



poly.addPoint(110,210);



poly.addPoint(60,160);



//change the color to
red and draw the filled
-
in polygon



g2.setColor(Color.RED);



g2.fill(poly);



//change the color to black and draw the outline of the polygon



g2.setColor(Color.BLACK);



g2.draw(poly);






//draw a label on the polygon



g2.drawString("This is a hexag
on.", 100, 160);





}

}




Computer Science Notes

Chapter 5


Page
9

of
9


File
Rectangle
ViewTest
.java

(
now modified to use dialog boxes
)

import javax.swing.JFrame;

import javax.swing.JOptionPane;


public class RectangleViewTest

{


public static void main(String[] args)


{



JFrame frame = new JFr
ame();



final int FRAME_WIDTH = 300;



final int FRAME_HEIGHT = 400;






frame.setSize(FRAME_WIDTH, FRAME_HEIGHT);



frame.setTitle("Test Picture");



frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);






RectangleComponentMirus component = new Rect
angleComponentMirus();



frame.add(component);



frame.setVisible(true);






String input = "";



double x = 0;



input = JOptionPane.showInputDialog("Enter x:");



x = Double.parseDouble(input);






JOptionPane.showMessageDialog(null, "x = " + x);


}


}