Images, Lines, Shapes
This document was written by CS 290W TA Joshua Kay and was last
modified
Okay, time to talk about images, lines, and all of that funky jazz.
We're only giving you enough to be dangerous here, but if you go with
it you should be able to create some pretty fun stuff.
The basic code to get and draw an Image...
<![CDATA[
import java.awt.*;
import java.applet.*;
public class ImageTest extends Applet
{
Image image;
public void init()
{
image =
getImage(getCodeBase(),"images/joshua.jpg");
}
public void paint(Graphics g)
{
g.drawImage(image,10,40,this);
}
}
]]>
Let's check it out!
- Image image;
- This is easy enough. We are creating an object image of class Image()
- image = getImage (getCodeBase(), "images/norespct.gif");
- getImage takes two parameters - the URL where you need to
look, and the name of the image. Note that because of applet
security restrictions, you need to put whatever images you
need on your own server.
getCodeBase() returns the URL of the directory containing the
applet
In some instances, it might be better to use getDocumentBase()
which returns the URL of the directory containing the
HTML document
- public void paint(Graphics g)
- We've seen this before... same idea here.
- g.drawImage(image,10,40,this);
- Much like drawString... takes the Image object you want to draw, x and y coordinates for the upper left corner and this refers to the Applet!
So, that's how you get and draw an Image onto the screen. You ought
to try this out and get used to it. Now we are going to look at some
of the Java drawing capabilities.
For all of the following, we are assuming that we are inside of the
public void paint (Graphics g) function...
Drawing Lines
g.drawLine(200,100,100,120);
This draws a line from 200,100 to 100,120. Draw several lines side by side if you want a thicker line.
Drawing Rectangles
g.drawRect(10,10,35,50);
This draws an empty rectangle with its upper left hand corner at 10,10 and width=35,height=50
g.fillRect(10,10,35,50);
This does the same thing, but fills in the rectangle!
g.drawRoundRect(10,10,35,50,5,5);
This draws a Rectangle with rounded corners. Upper lefthand corner is at 10,10, width=35 height=50 and the last two arguments signify how far from the corners should the sides start rounding.
Drawing Ovals and Circles
g.fillOval(200,100,10,10);
Draw a filled oval at 200,100 with height and width of 10. Changing either the height or the width so that they are no longer equal would change it from a circle to an oval.
Drawing Polygons
Drawing polygons is a little bit trickier. Polygons have random shapes, and unknown number of points - so we store the coordinates in a couple of integer arrays.
<![CDATA[
int[] xPol= { 100,200,300 };
int[] yPol = { 300,200,100 };
int points = 3;
g.fillPolygon(xPol, yPol, points);
]]>
All polygons are completed automatically by connecting all of the points together.
g.drawPolygon would just draw it, fillPolygon fills it all one color...
You can also create a Polygon Object and store everything there...
<![CDATA[
int[] newShapeX = { 100,200,300};
int[] newShapeY = { 300,250,200};
Polygon newShape =
new Polygon(newShapeX, newShapeY, 3);
g.fillPolygon(newShape);
]]>
Polygons are automatically completed, so if you want a partial Polygon you will need to use the following...
<![CDATA[
int[] xPol = {100,200,300};
int[] yPol = {300,200,100};
int points = 3;
g.drawPolyline(xPol, yPol, points);
]]>
The difference here is that drawPolyline does not complete the line between the first and last points.
<![CDATA[
import java.awt.*;
import java.applet.*;
public class ImageTest extends Applet
{
public void init()
{
setBackground(Color.red);
}
public void paint(Graphics g)
{
g.setColor(Color.white);
g.drawLine(0,0,300,300);
g.drawLine(300,0,0,300);
g.drawOval(150,150,35,35);
g.fillRoundRect(10,10,20,80,5,5);
}
}
]]>
As always, let's check it out...