Tutorial 1
From Java Tutorials
This tutorial covers a basic applet that says Welcome to Java in different colours, and provides an introduction to the Graphics class.
Contents |
[edit] Applets
Applets are different from command line Java programming in that the interaction is pretty much all channeled through a little graphical panel on the screen (the applet!), rather than reading things on the command line and typing in commands. Typically, you'll view an applet through a web browser, or by using Appletviewer which is included with the JDK. Applets can handle mouse and keyboard input which we'll handle later. You can draw things directly to the applet too which is what we'll cover in this tutorial.
[edit] Hello World
Not the standard Hello World, but Welcome to Java. You'll see why later on :P
In JCreator, go to File -> New and select Basic Java Applet. Give your project a name, and JCreator will create some files for you - the file names are listed in the left hand Workspace window. Double click Tutorial_1.java (or WhateverYouCalledYourProject.java!) and the code will be shown. You should see something like this:
/*
* Some automatically generated comments.
*/
import java.awt.*;
import java.applet.*;
public class Tutorial_1 extends Applet {
public void init() {
}
public void paint(Graphics g) {
g.drawString("Welcome to Java!!", 50, 60 );
}
}
Compile your applet by pressing F7. Any compilation errors will show up in the bottom window. If there aren't any (there shouldn't be at this stage!) then run the applet by pressing F5 in JCreator. You should see a window appear saying "Welcome to Java!!" :)
OK so what goes on here? We'll look at the paint() method. It takes one argument, a Graphics object, which is what we'll use to draw to the applet. paint() is called each time the applet has to redraw itself, like when you obscure the applet with another window, or if you have just un-minimised your browser window. The Graphics class has a drawString method that draws a String (just text) to the applet. Can you find this in the Java documentation? Hint: look under Classes in the bottom left frame, and find Graphics. Then, all of the methods in the Graphics class are listed in the main frame. It may be confusing/overwhelming at first but the documentation is extremely useful so it's important that you can use it well. You should find something like this:
public abstract void drawString(String str,
int x,
int y)
Draws the text given by the specified string, using this graphics context's current font and color. The baseline of the leftmost character is at position (x, y) in this graphics context's coordinate system.
Parameters:
str - the string to be drawn.
x - the x coordinate.
y - the y coordinate.
So in our example, we have
g.drawString("Welcome to Java!!", 50, 60 );
So the applet will print the text "Welcome to Java!!" at a location 50 pixels along the x axis, and 60 pixels down the y axis. In Java, the origin (x=0 and y=0) is placed at the top left corner, and x increases across the applet, and y increases down the applet. Note that this may be different to what you expect (think of standard maths graphs where y increases as you go upwards - this is the opposite).
Compile and run again. Does it do what you expect? Try moving the text around by changing the numbers, and recompiling the code. Does it still do what you expect? What happens if you put negative numbers in? Try changing x to -10. What happens? What happens if you go outside of the applet's boundaries?
[edit] Colours
Try changing the colour of the text by inserting a line immediately before the g.drawString() call:
g.setColor(Color.red);
Note that the colour will stay the same until you change it again. Look up the Color class in the documentation. You'll notice that red is a predefined colour in this class. You can also try creating your own colours:
g.setColor(new Color(0, 0, 100));
This will make the text dark blue.
[edit] Shapes
Obviously just printing text to the screen won't get you very far. Luckily the Graphics class has methods for drawing ovals, rectangles and lines, and also for drawing filled ovals and rectangles. There's also much more but that's all we're interested in right now.
Have a look at the method called drawOval() in the documentation. You specify one corner of the oval, and the width and height of the oval. Try putting this in your paint() method:
g.drawOval(50,50,100,50);
What should it do? Compile and run your code and see if it does what you think. What happens if the width and height are the same? Try changing the name drawOval to fillOval - the parameters are the same. Try changing the parameters to different values. Change fillOval to fillRect. Are the parameters the same?
What do you think this code should do if you put it in your paint() method?
g.setColor(Color.black); g.fillRect(0,0,150,150); g.setColor(Color.blue); g.fillOval(0,0,150,150); g.setColor(Color.white); g.fillOval(25,25,100,100); g.setColor(Color.red); g.fillOval(50,50,50,50);
Try it and see!
| Java Games Programming Tutorials |
|
Getting started
|
