Graphics
Graphics Lesson Intro
Graphics and Applets are not part of the AP* Exam, but they are very important in programming. The System.out window is very primitive and would never be used for any real application. Creating your own graphical interface (even if it only diplays text) is a very important step in making any program. Luckily, as with all other things in Java, somebody else has done most of the work and you can simply import their code and use it to make your own things.
We will not do any class assignments that involve graphics, but I would like to give you the opportunity to learn about them. So, I will be adding Graphics lessons that you can do at your own pace if you choose to. There may be extra credit points available for using graphics later, but other than that these are completely done on your own for the sake of gaining knowledge.
One bit of caution - You should not start doing graphics if you are not comfortable with the material we've been covering. This is much different and can really confuse you if you don't yet understand the other stuff.
The first lesson follows.
Graphics Lesson 1
Example, which draws a rectangle on the screen. This example is looked at in more detail in the lines below.
import java.applet.Applet;
import java.awt.*;
public class Shape extends Applet
{
public void paint (Graphics page)
{
page.drawRect (50, 60, 70, 80);
}
}
That class in more detail:
The first thing we need to do for a class that lets us draw is to import the two things we need.
import java.applet.Applet;
import java.awt.*;
The java.applet.Applet import is what allows us to create an applet window and java.awt.* (* means everything inside of that class) is what lets us create graphics.
Next we make our class name, which is similar to what we've already done but has a couple extra words.
public class Shapes extends Applet
In that definition, "Shapes" is the class name which is the same as all of the class names we've made and can be changed to any word you want. The last two words "extends Applet" is something that you'll just have to trust for now and will VERY MUCH be explained later on.
Next, you need to make the method. This is different from the "main" method that we've been putting into all of our programs, as you'll see.
public void paint (Graphics page)
In this method definition, you have a few things. "public" and "void" are the same as we've done before. There is no "static" or "main (String[] args)", though what we're doing here is similar. When we do a method called "main" we pass on a paramater that is (String[] args) which means we're passing an array (String[]) with the variable name "args". Here we are creating a method called "paint" and passing a parameter that is "Graphics" and calling it "page".) You could change "page" to something else, but you would also have to replace "page" with your word everywhere you see it in everything else.
After that we are ready to draw on our "page". to do this, we use a line like this:
page.drawRect (50, 60, 70, 80);
There are many drawing commands, and you must understand what they do. Let's look at the one above, which draws a square.
page.drawRect - the command to draw a rectangle
50 - the x coordinate of the top-left corner of the rectangle
60 - the y coordinate of the top-left corner of the rectangle
70 - the width of the rectangle
80 - the height of the rectangle
Important note - The x and y coordinates are not the same as they are in Math! 0,0 on a plane in Math is the bottom left. On a computer, 0,0 is the top left. Positive Y goes DOWN, not up. Other than that, they work the same.
Here are some more things you can call to draw items:
drawRect (int x, int y, int width, int height)
drawOval (int x, int y, int width, int height)
picture an oval inside of the box defined by those parameters
drawLine (int x1, int y1, int x2, int y2)
drawArc (int x, int y, int width, int height, int startAngle, int arcAngle)
that one is explained well on page 102 of your book
drawString (String str, int x, int y)
a way to put text on your page
setColor (Color color)
Set the color of whatever you're going to do next
setBackground (Color color)
Sets a background color for your applet window
fillRect (int x, int y, int width, int height)
A rectangle that is the color you set
fillOval (int x, int y, int width, int height)
fillLine (int x1, int y1, int x2, int y2)
fillArc (int x, int y, int width, int height, int startAngle, int arcAngle)
that one is explained well on page 102 of your book
Make these two classes to get a feel for how all this works.
import java.applet.Applet;
import java.awt.*;
public class Einstein extends Applet
{
public void paint (Graphics page)
{
page.drawRect (50, 50, 40, 40);
page.drawRect (60, 80, 225, 30);
page.drawOval (75, 65, 20, 20);
page.drawLine (35, 60, 100, 120);
page.drawString ("Out of clutter, find simplicity.", 110, 70);
page.drawString ("-- Albert Einstein", 130, 100);
}
}
Compile that and choose "Run Applet" from the menu where you usually run things. When the second window comes up, set it to "Run Applet in appletviewer" and click "Ok".
Another one (this one uses a couple variables):
Show Code Numsimport java.applet.Applet;
import java.awt.*;
public class Snowman extends Applet
{
public void paint (Graphics page)
{
final int MID = 150;
final int TOP = 50;
setBackground (Color.cyan);
page.setColor (Color.blue);
page.fillRect (0, 175, 300, 50); // ground
page.setColor (Color.yellow);
page.fillOval (-40, -40, 80, 80); // sun
page.setColor (Color.white);
page.fillOval (MID - 20, TOP, 40, 40); // head
page.fillOval (MID - 35, TOP + 35, 70, 50); // middle
page.fillOval (MID - 50, TOP + 80, 100, 60); // bottom
page.setColor (Color.black);
page.fillOval (MID - 10, TOP + 10, 5, 5); // eye
page.fillOval (MID + 5, TOP + 10, 5, 5); // eye
page.drawArc (MID - 10, TOP + 20, 20, 10, 190, 160); // smile
page.drawLine (MID - 25, TOP + 60, MID - 50, TOP + 40); // arm
page.drawLine (MID + 25, TOP + 60, MID + 55, TOP + 60); // arm
page.drawLine (MID - 20, TOP + 5, MID + 20, TOP + 5); // brim of hat
page.fillRect (MID - 15, TOP - 20, 30, 25); // hat
}
}
(0) Comments
Post a Comment