Download Graphics

•Learn about the types of Graphics that
are available
•Develop a basic Graphics applet
•Develop a basic Graphics application
•Review the Java API and use it to
enhance the previous projects
(You won’t be learning the cuttingedge graphics for games, just the
basics.)
Here are some terms that you’ll encounter
in your lesson on graphics:
•AWT
•Swing
•Applet/JApplet
•Graphics object
•init()
•GUI
Graphics can be simple or
complex, but they are just data
like a text document or sound.
Java is very good at graphics,
especially for the web and small
devices like phones.
Java can write applications or
applets, as you know by now.
It can make graphics in either one,
and has two libraries to do it with:
Swing (the newer kind) or AWT
(Abstract Windowing Toolkit, the
older kind).
To start, here’s a basic applet that
demonstrates Java graphics using
AWT:
import java.awt.*;
import java.applet.Applet;
public class BasicGraphics extends Applet {
public void paint(Graphics g) {
g.setColor(Color.red);
g.fillRect(10, 20, 40, 40);
} // end paint()
} // end class BasicGraphics
Try to compile this
code and run it as an
applet.
What do you see?
import java.awt.*;
import java.applet.Applet;
The first lines are
import statements, to
load the AWT and
public class BasicGraphics extends Applet { Applet libraries.
public void paint(Graphics g) {
g.setColor(Color.red);
g.fillRect(10, 20, 40, 40);
If you were making a
} // end paint()
Swing version, you
would load Swing
} // end class BasicGraphics
libraries.
import java.awt.*;
import java.applet.Applet;
Our class is called
BasicGraphics, and it
extends Applet to
public class BasicGraphics extends Applet { inherit Applet
public void paint(Graphics g) {
properties.
g.setColor(Color.red);
g.fillRect(10, 20, 40, 40);
} // end paint()
} // end class BasicGraphics
import java.awt.*;
import java.applet.Applet;
Inside the applet, we
have just one method:
paint()
public class BasicGraphics extends Applet {
(Remember from
public void paint(Graphics g) {
Applets that other
g.setColor(Color.red);
methods are optional.)
g.fillRect(10, 20, 40, 40);
} // end paint()
It has one parameter,
} // end class BasicGraphics
called the “abstract
Graphics object”, and
we call it “g”.
Get used to this, you
need to tell paint()
what to paint on!
import java.awt.*;
import java.applet.Applet;
public class BasicGraphics extends Applet
public void paint(Graphics g) {
g.setColor(Color.red);
g.fillRect(10, 20, 40, 40);
} // end paint()
} // end class BasicGraphics
paint() has two methods
inside of it: setColor and
fillRect
{
g.setColor(Color.red); is
the command to color
whatever graphic “thing”
we have “red”.
The computer still
doesn’t know what
Graphic “thing” g is going
to be!
import java.awt.*;
import java.applet.Applet;
g.fillRect(10, 20, 40, 40)
tells the applet to make g
into a “fillRect”, which is
public class BasicGraphics extends Applet { a “filled rectangle”.
public void paint(Graphics g) {
10 is the starting xg.setColor(Color.red);
position in the applet,
g.fillRect(10, 20, 40, 40);
} // end paint()
20 is the starting y} // end class BasicGraphics
position in the applet
40 is the width and the
other 40 is the height.
Remember what color
will fill it? Red!
0,0
800,0
By they way, a computer
screen has reverse geometry,
kind of.
It’s still (x, y), but the “origin”
is the upper left corner. Then
you add to the right and/or
down.
The box on the left
demonstrates how you would
measure an 800x600 screen.
0,600
800,600
“X” is at about (400, 100).
How do you remember all of this stuff?
You don’t!
All of this is listed in the Java API. To see the methods that you can use
on “g”, our Graphics object, look at this link:
http://java.sun.com/j2se/1.5.0/docs/api/java/awt/Graphics.html#method_s
ummary
Want to see a simple edit? Change g.fillRect to g.fillOval in your
program.
You can do whatever changes you want, just find it in the API and make
sure your parameters are filled in correctly!
What would that applet look like if we
used Swing instead of the old AWT?
import javax.swing.*;
import java.awt.*;
public class BasicSwingGraphics extends javax.swing.JApplet {
public void paint(Graphics g) {
/* Draw the square. */
g.setColor(Color.red);
g.fillOval(10, 20, 40, 40);
} // end paint()
} // end class BasicSwingGraphics
Why is there a Swing and an AWT?
AWT was the original graphics library for Java. However, all programs
looked like their “host”. That is, when they ran on a Mac, they looked
like Mac programs, and when they ran on Windows, they looked like
Windows programs.
Programmers wanted to force the “look and feel”, so they built Swing on
top of AWT. Yes, Swing includes all of AWT.
AWT is still seen as better for applets, but that’s fading due to AJAX,
another web programming technique.
Applets need a web page to run, but
applications can run on their own.
Now we’ll take a look at an application
written in Swing!
import javax.swing.*;
First, we import the
public class SimpleFrame extends JFrame
Swing libraries (notice
{
it’s javax.swing) to
public SimpleFrame()
support our work.
{
setBounds(50,100,400,150);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
setTitle("This is a test frame!");
}
public static void main(String[] args)
{
new SimpleFrame();
}
}
//from http://cs.guc.edu.eg/courses/onlinetutorial/gui.html
Then, we begin our
class. We don’t
extend Applet, we
extend JFrame,
because applications
use them to hold
graphics.
import javax.swing.*;
public class SimpleFrame extends JFrame
{
public SimpleFrame()
{
setBounds(50,100,400,150);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
setTitle("This is a test frame!");
}
public static void main(String[] args)
{
new SimpleFrame();
}
}
//from http://cs.guc.edu.eg/courses/onlinetutorial/gui.html
import javax.swing.*;
The class constructor
public class SimpleFrame extends JFrame
creates:
{
-location and size of
public SimpleFrame()
the frame
{
setBounds(50,100,400,150);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
setTitle("This is a test frame!");
}
public static void main(String[] args)
{
new SimpleFrame();
}
}
//from http://cs.guc.edu.eg/courses/onlinetutorial/gui.html
import javax.swing.*;
The class constructor
public class SimpleFrame extends JFrame
creates:
{
-the way it closes (this
public SimpleFrame()
one is that little “X” box
{
on the top right
setBounds(50,100,400,150);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
setTitle("This is a test frame!");
}
public static void main(String[] args)
{
new SimpleFrame();
}
}
//from http://cs.guc.edu.eg/courses/onlinetutorial/gui.html
import javax.swing.*;
The class constructor
public class SimpleFrame extends JFrame
creates:
{
-visibility (you can see it)
public SimpleFrame()
{
-title (the blue bar on top)
setBounds(50,100,400,150);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
setTitle("This is a test frame!");
}
public static void main(String[] args)
{
new SimpleFrame();
}
}
//from http://cs.guc.edu.eg/courses/onlinetutorial/gui.html
import javax.swing.*;
Finally, we have a
public class SimpleFrame extends JFrame
main method to create
{
the frame!
public SimpleFrame()
Compile and run it!
{
setBounds(50,100,400,150);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setVisible(true);
setTitle("This is a test frame!");
}
public static void main(String[] args)
{
new SimpleFrame();
}
}
//from http://cs.guc.edu.eg/courses/onlinetutorial/gui.html
Now you’re an expert on Java Graphics – NOT!!!
However, you did create your first “Graphical User Interface”, or GUI
(pronounced “gooey”, like something on your shoe at the movies).
It’s a vast subject, but plenty of free resources. See more at:
http://java.com – examples of Java game and cellphone graphics
http://java.sun.com/docs/books/tutorial/uiswing/index.html - The
beginner’s tutorial book to Swing graphics
And search the web for other examples. Don’t forget the API!
Now try the “Graphics Lab”.
You’ll build on the applets you saw in
this lesson.