learn about the types of graphics that are available develop a basic graphics applet develop a basic...
TRANSCRIPT
•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 cutting-edge 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;
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
The first lines are import statements, to load the AWT and Applet libraries.
If you were making a Swing version, you would load Swing libraries.
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
Our class is called BasicGraphics, and it extends Applet to inherit Applet properties.
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
Inside the applet, we have just one method: paint()
(Remember from Applets that other methods are optional.)
It has one parameter, 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;
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
g.fillRect(10, 20, 40, 40) tells the applet to make g into a “fillRect”, which is a “filled rectangle”.
10 is the starting x-position in the applet,
20 is the starting y-position in the applet
40 is the width and the other 40 is the height.
Remember what color will fill it? Red!
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.
“X” is at about (400, 100).
0,0
800,600
800,0
0,600
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_summary
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.*;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
First, we import the Swing libraries (notice it’s javax.swing) to support our work.
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
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
The class constructor creates:
-location and size of the frame
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
The class constructor creates:
-the way it closes (this one is that little “X” box on the top right
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
The class constructor creates:
-visibility (you can see it)
-title (the blue bar on top)
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
Finally, we have a main method to create the frame!
Compile and run it!
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.