Graphics
There are three kinds
of Java programs:
Console applications
Graphical applications
Applets
Console applications
run in a single, plain-
looking window.
Graphical applications
use windows filled
with user interface
components such as
buttons, text input
fields, menu, and so
on.
Applets are similar to
graphical applications,
but they run inside a
web browser.
Applets
To display an applet,
we need to
Write and compile to
generate the applet
code
Write an HTML file to
tell the browser how
to find the code for the
applet
An example of an
applet that draw
rectangles
First, write Java
program and compile it
to generate
“Rect.class”
Then, create an HTML
file and save it as
“Rect.html”
Finally, use
appletviewer to run
the HTML file that
contains the applet
A Simple Java Applet
// Example 1:
HelloApplet
import
java.applet.Applet;
import
java.awt.Graphics;
public class
HelloApplet extends
Applet {
public void paint
(Graphics g) {
g.drawString(“Hello !”,
25, 25);
}
}
How to Compile and
Run a Java Applet
To Compile
c:> javac HelloApplet.java
To Run an applet, we
need HelloApplet.html
class” width=500
height=300
Then, To run this
applet,
c:> appletviewer
HelloApplet.html
or use any browsers,
e.g. Netscape,
Internet Explorer.
Java Plug-In
The Browser Program
That can run Java
Applet is called having
applet container.
Applet Container of
J2SDK is appletviewer
If any Browser don't
have Java Runtime
Environment (JRE) for
Java 2
We need to use Java
Plug-In HTML
Converter ( for more
information please
look at java.sun.com/
products/plugin)
For J2SDK use
HTMLConverter
filename.html
Applets
File “Rect.html”
WIDTH=300
HEIGHT=300>
VALUE=“1.0”>
VALUE=“0.7”>VALUE=“0.7”>
// Rect.java
import java.awt.*;
import java.applet.*;
public class Rect
extends Applet
{ private Color colr;
public void init()
{ float r =
Float.parseFloat
(getParameter(“Red”));
float g =
Float.parseFloat
(getParameter
(“Green”));
float b =
Float.parseFloat
(getParameter(“Blue”))
;
}
public void paint
(Graphics g)
{ Graphics2D g2 =
(Graphics2D)g;
Rectangle box = new
Rectangle(5, 10, 20,
30);
colr = new Color(r, g,
b);
g2.setColor(colr);
g2.draw(box);
}
}
Graphical Shapes
To draw a rectangle,
we need to specify its
bounding box, namely
the x- and y-
coordinates of the top
left corner and the
width and height of the
box.
Rectangle cerealBox =
new Rectangle(5, 10,
20, 30);
To draw an ellipse, we
need to specify its
bounding box, namely
the x- and y-
coordinates of the top
left corner and the
width and height of the
box.
Ellipse2D.Float Egg =
new Ellipse2D.Float(5,
10, 20, 25);
Import Graphics
Classes
To use graphical
utilities such as paint,
we have to import the
Graphics2D class
import
java.awt.Graphics;
import
java.awt.Graphics2D;
To draw a rectangle,
we have to import the
Rectangle class.
import
java.awt.Rectangle;
To draw an ellipse, we
have to import the
Ellipse class.
import
java.awt.geom.Ellipse;
Graphical Shapes
import
java.awt.geom.Ellipse;
Ellipse2D.Double pic1 =
new Ellipse2D.Double
(5,10,15,20);
g2.draw(pic1);
Line2D.Double
segment = new
Line2D.Double(x1, y1,
x2, y2);
g2.draw(segment):
Color
Color magenta = new
Color(1.0F, 0.0F, 1.0F);
// Color.black,
Color.blue, Color.cyan,
Color.gray,
Color.green,
// Color.pink, Color.red,
Color.white,
Color.yellow
Example: CarDrawer
Program
import java.awt.*;
import java.applet.*;
public class CarDrawer
extends Applet
{ public void paint
(Graphics g)
{ Graphics2D g2 =
(Graphics2D)g;
Rectangle body = new
Rectangle(100, 110, 60,
10);
Ellipse2D.Double
FrontTire =
new Ellipse2D.Double
(110, 120, 10, 10);
Ellipse2D.Double
RearTire =
new Ellipse2D.Double
(140, 120, 10, 10);
Point2D.Double r1 =
new Point2D.Double
(110, 110);
// the bottom of the
front windshield
Point2D.Double r2 =
new Point2D.Double
(120, 100);
// the front of the roof
Point2D.Double r3 =
new Point2D.Double
(140, 100);
// the rear of the roof
Point2D.Double r4 =
new Point2D.Double
(150, 100);
// the bottom of the
rear windshield
Line2D.Double
frontWindshield =
new Line2D.Double(r1,
r2);
Line2D.Double roofTop
=
new Line2D.Double(r2,
r3);
Line2D.Double
rearWindshield =
new Line2D.Double(r3,
r4);
g2.draw(body);
g2.draw(frontTire);
g2.draw(rearTire);
g2.draw(body);
g2.draw
(frontWindshield);
g2.draw(roofTop);
g2.draw
(rearWindshield);
}
}
a
Fonts
A syntax for drawing a
FONT object is:
g2.drawString
(“Applet”, 50, 100); //
Figure 7
To construct a Font
object, we specify:
1. The font face name:
- logical face name:
Serif, Sans Serif,
Monospaced, Dialog,
DialogInput
-typeface name: Times
Roman, Helevetica
2. The style:
Font.PLAIN, Font.BOLD,
Font.ITALIC, or
Font.BOLD+Font.Italic
3. The point size: 72
points per inch
8 points (small), 12
point (medium), 18
point (large), 36 point
(huge)
Text Layout
Here is how we can
write “Applet” in huge
pink letters:
final int HUGE_SIZE =
36;
String message =
“Applet”;
Font hugeFont = new
Font(“Serif”,
Font.BOLD, HUGE_SIZE);
g2.setFont(hugeFont);
g2.setColor(Color.pink)
;
g2.drawString
(message, 50, 100);
A typographical
measurements (Figure
9):
- The ascent, the
descent, and the
leading of a font.
- The advance of the
text is the width of the
text.
To measure the size of
a string, we need to
construct a TextLayout
object. Its constructor
need three
parameters:
1. The string to
measure
2. The font to use
3. A
FontRenderContext
object
For example, how to
create TextLayout
object.
String message =
“Applet”;
Font hugeFont = new
Font(“Serif”,
Font.BOLD, HUGE_SIZE);
FontRenderContext
context = g2.
getFontRenderContext
();
TextLaout layout =
new TextLayout
(message, hugeFont,
context);
Now we can query the
ascent, descent,
leading, and advance
by using getAscent,
getDescent,
getLeading, and
getAdvance methods
of the TextLayout
class.
float xMessageWidth =
layout.getAdvance();
float yMessageHeight
= layout.getAscent() +
layout.getDescent()
Figure 10 - To put a
string in the middle of
the window:
float xLeft = 0.5F *
(getWidth() -
xMessageWidth);
float yTop = 0.5F *
(getHeight() -
yMessageHeight);
float yBase = yTop +
layout.getAscent();
g2.drawString
(message, xLeft,
yBase);
Applets’ Methods
The methods of applet
class that determine
the life cycle of an
applet are shown on
the next slide
These methods can be
used to initialize the
variables or delete any
unused variables
Life Cycle of Applet
init() : Called once,
when the browser or
applet viewer loads
the applet
start() : Called every
time the user enters
the web page
containing the applet
paint() : Called every
time the surface of the
applet needs to be
repainted
stop() : Called every
time the user exits the
web page containg the
applet
destroy() : Called once,
when the browser or
applet viewer exits
and unloads the applet
Programming
Exercises
1. Write a program that
draws your name in
red, centered inside a
blue rectangle.
2. Write a program that
draws five strings, one
each in its own color.
3. Write a program that
prompts the user to
enter a radius. Draw a
circle with that radius.
4. Write an interactive
program that draws a
large ellipse, filled
with your requested
color, that touches the
window boundaries.
The ellipse should
resize itself when you
resize the window.
No comments:
Post a Comment