Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
Download Graphics
Document related concepts
Anaglyph 3D wikipedia , lookup
Free and open-source graphics device driver wikipedia , lookup
Color vision wikipedia , lookup
Indexed color wikipedia , lookup
List of 8-bit computer hardware palettes wikipedia , lookup
MOS Technology VIC-II wikipedia , lookup
Hold-And-Modify wikipedia , lookup
Graphics processing unit wikipedia , lookup
Framebuffer wikipedia , lookup
BSAVE (bitmap format) wikipedia , lookup
Molecular graphics wikipedia , lookup
Tektronix 4010 wikipedia , lookup
Transcript
Introductory Graphics
In this section we will learn how about how to draw graphics on the screen in
Java:
Drawing Lines
The Graphics Screen
Drawing Shapes
Colours
Filled Shapes
Displaying Characters
Comments
PHY-102 SAP
Introductory Graphics
Slide 1
Drawing Lines
Create a file
FirstLine.java
containing this:
import java.awt.*;
import java.applet.Applet;
public class FirstLine extends Applet {
public void paint(Graphics g) {
g.drawLine(0, 0, 100, 100);
}
}
Create a file FirstLine.html containing this:
<html>
<head>
<title>Web Page with Applet</title>
</head>
<body>
<applet code="FirstLine.class" width=300 height=250 ></applet>
</body>
</html>
Compile FirstLine.java and run the appletviewer on FirstLine.html
PHY-102 SAP
Introductory Graphics
Slide 2
What does it mean?
When the applet runs, every time the Java Virtual Machine decides the window
needs to be redrawn (at the start, if you resize the window etc.) it calls a method
called paint. You supply the code the that executes when paint is called as shown:
import java.awt.*;
import java.applet.Applet;
public class FirstLine extends Applet {
public void paint(Graphics g) {
g.drawLine(0, 0, 100, 100);
}
}
In a simple program like this there is only one window - however in a complicated
program there may be many. The 'Graphics g' is a parameter being passed to paint
to tell you which window to use. The g.drawLine(...) means draw a line on the window
called g.
PHY-102 SAP
Introductory Graphics
Slide 3
The Graphics Screen
Java graphics (like most languages) uses a coordinate system based on pixels. The
whole screen is made up of many pixels which are small dots that can each be set
to a separate colour.
Modern displays support several different numbers of pixels :
(Width X Height) 640 X 480, 800 X 600, 1024 X 768, 1152 X 864, . . .
Each pixel has an x and y coordinate measured across and down from the top left
hand corner (not like a conventional x-y coordinate system).
(0, 0)
x
y
PHY-102 SAP
Introductory Graphics
Slide 4
Drawing a Line
(x1, y1)
g.drawLine (x1, y1, x2, y2);
public void paint(Graphics g) {
g.drawLine(0, 0, 100, 100);
}
PHY-102 SAP
Introductory Graphics
(x2, y2)
Slide 5
Drawing Other Shapes
Line:
g.drawLine (x1, y1, x2, y2 );
(x2, y2)
(x1, y1)
width
(x1, y1)
Rectangle:
height
g.drawRect (x1, y1, width, height );
Oval (Circle or Ellipse):
width
(x1, y1)
g.drawOval (x1, y1, width, height );
height
arc
(x1, y1)
Arc:
angle
g.drawArc (x1, y1, width, height, angle1, angle );
The Oval and Arc shapes are drawn inside
an imaginary rectangle.
PHY-102 SAP
height
angle1
width
Introductory Graphics
Slide 6
Colours
You can set the background colour using:
setBackground (colour);
You can set the colour of the next object you draw using:
g.setColor (colour );
There are 13 standard colours as members of the Color class:
black
( 0,
0, 0)
cyan
( 0, 255, 255)
gray
(128, 128, 128)
lightGray (192, 192, 192)
orange (255, 200, 0)
red
(255, 0, 0)
yellow
(255, 255, 0)
Note: US
gray not grey
Or you can define your own using:
e.g.
blue
( 0, 0, 255)
darkGray ( 64, 64, 64)
green
( 0, 255, 0)
magenta (255, 0, 255)
pink
(255, 175, 175)
white
(255, 255, 255)
Note: US Color
not colour
These are the
amount of Red,
Green and Blue
on a scale of 0
to 255
Color mycolour = new Color(R, G, B );
setBackground(Color.lightGray);
Color myGreen = new Color(0, 200, 0);
g.setColor(myGreen);
PHY-102 SAP
Introductory Graphics
Slide 7
Filled Shapes
As well as the draw methods there are a set of methods for filling the shapes
with identical parameters to those of the draw equivalents.
width
(x1, y1)
Rectangle:
height
g.fillRect (x1, y1, width, height );
width
(x1, y1)
Oval (Circle or Ellipse):
g.fillOval (x1, y1, width, height );
height
arc
Arc:
(x1, y1)
angle
g.fillArc (x1, y1, width, height, angle1, angle );
fillArc produces a pie shape rather than an arc.
PHY-102 SAP
height
angle1
width
Introductory Graphics
Slide 8
Filling Shapes Example
import java.awt.*;
import java.applet.Applet;
public class FirstShapes extends Applet {
public void paint(Graphics g) {
setBackground(Color.lightGray);
g.drawRect(30, 30, 80, 40);
g.drawOval(120, 30, 50, 50);
Color myGreen = new Color(0, 200, 0);
g.setColor(myGreen);
g.fillRect(30, 100, 80, 40);
g.fillOval(120, 100, 50, 50);
g.drawLine(30, 160, 130, 170);
g.setColor(Color.black);
g.drawArc(30, 180, 50, 50, 60, 40);
g.setColor(Color.red);
g.fillArc(120, 180, 50, 50, 60, 40);
}
}
The statements
are executed
sequentially
(unless we
specify
otherwise).
The background is set, the unfilled rectangle are drawn using the default colour (black),
the colour is set to myGreen and the filled rectangle and oval drawn, the colour is set
back to black and the arc drawn and finally the colour is set to red and the pie drawn.
PHY-102 SAP
Introductory Graphics
Slide 9
Displaying Characters
We have already used drawString to display characters:
g.drawString("Hello World!", 50, 50);
The parameters are:
g.drawString (string, x1, y1 );
(x1, y1)
The start of the string
The String
The string itself
Imaginary line on which
the characters rest
The simplest string is a sequence of characters
enclosed within double-quote " " characters.
PHY-102 SAP
Introductory Graphics
Slide 10
Comments
You can annotate your programs with comments. These are statements or parts of
statements in the file which help you or someone else understand the program but
are ignored by the computer. There are two types:
Single line comments - everything following a // is treated as a comment and
ignored.
This line is ignored
This line is ignored from here onwards
// Define my own colours
Color myGreen = new Color(0, 200, 0);
g.setColor(myGreen);
g.fillOval(120, 100, 50, 50); // This oval will be green
Multi-line comments - everything between a /* and a */ is treated as a comment
and ignored.
All this is ignored
/* This is my first Applet *
* Author: A.N.Other
*
* Date: 1st April 2000
*/
Not necessary only makes it look
pretty
Comments things that are not obvious but not those that are !
PHY-102 SAP
Introductory Graphics
Slide 11
