Contents  The Basics  Capabilities  Printable version  Discuss this article  in the forums The Series  The Basics  Making a  Simple Game  The Power of Arrays

Altering the Appearance of Text

Java provides the ability to change the font of the text which you are displaying. While it only supports a small number of fonts it is still a useful capability which you may want to take advantage of in your games.

private Font a_Font;

public void init()
{
  a_Font = new Font("Helvetica", Font.BOLD, 48);
  setFont(a_Font);
}

The addition of the above lines to our applet will allow us to change the font in which our text appears. These lines should be placed after the opening curly brace of the class and before the paint method. You will also notice the use of a new method here. The init method is called automatically when the applet is first loaded. If you have some initialization code and code that only needs to happen when the applet is first loaded then this is the place to put it. You must make sure that you spell init the same way that I have done. If you spell it incorrectly or use improper capitalization then it will appear to Java as a different method and will not be called automatically. This problem will not be flagged for you by the compiler so you must be extremely careful when you write your methods to get spelling and capitalization perfect. Trying to track this problem down can be annoying.

The first parameter in the above font creation code is the name of the font that we want to use. These could be "TimesRoman", "Helvetica", "Courier", "Dialog", and "DialogInput" which work, but are being replaced by "Serif", "SansSerif", and "Monospaced". The second parameter specifies the style of our new font. This can be Font.BOLD, Font.PLAIN, Font.ITALIC, or Font.BOLD + Font.ITALIC. The last parameter specifies the size of the new font.

In order to put our new font to work we must use the setFont method with our new font passed as a parameter. This will change the font for the entire applet for the entire life span of the applet to our font. If you want to bounce back and forth between fonts you will set the font in the paint method instead using the setFont method prefixed by the graphics context (g.setFont(...);).

Another way you can alter the appearence of text is by changing the color of it.

g.setColor (Color.red);

This line of code is normally found in the paint method because you need a graphics context in order to use it. The code itself is not bad and some of the colors that are available to you are listed below.

Color.black   Color.blue    Color.cyan       Color.darkGray
Color.gray    Color.green   Color.lightGray  Color.magenta
Color.orange  Color.pink    Color.red        Color.white
Color.yellow

The colors listed previously will probably suit your needs, but you may be interested in creating your own colors on occasion. The code to do this is very simple and you will probably notice similarities between it and the code used to create a new font.

Color adamBlue = new Color (80,124,224);
g.setColor(slateBlue);

The three numbers in the constructor of our new color are the RGB values. Each of the numbers must be between 0 and 255. If you are unsure about what a constructor is and why I use the keyword new don't worry for now. Take everything I say as unquestionable truth and we will talk about it later when we discuss classes and how they fit into our games. One thing that I didn't mention previously is that when you call the setColor method it also changes the color of everything you do after that point including more text and shapes which we will talk about in a minute.

Two other useful functions that are available for you use are setBackground(..) and setForeground(..).

setBackground(Color.yellow);
setForeground(Color.blue);

These two lines, if used, are generally found in the init method. The setForeground method has the same effect as the g.setColor statement except that the effect is permanent for everything in your applet. I recommend that you use g.setColor because as you make your games you are going to want to frequently change colors. The setBackground method is good for now, but in a little bit I will introduce the idea of double buffering and with it a new way to set the background color.

Shapes

Shapes are a very important topic because they will play a crucial role in quite a few of the games that you will write. There is no built in 3D segment in Java, but I may discuss a way around this later. Java provides several built-in methods to allow for quick and easy drawing of shapes. Each of these will usually be called from your paint method.

drawRect (int x, int y, int width, int height)
      eg g.drawRect (5,8,49,29);
drawOval (int x, int y, int width, int height)
drawLine (int x1, int x2, int y1, int y2)
drawRoundRect (int x, int y, int width, int height, int arcWidth, int arcHeight)
drawArc (int x, int y , int width, int height, int startAngle, int arcAngle)
draw3DRect (int x, int y, int width, int height, boolean raised)

For all of the above shapes, except for the line, there is a filled alternative.

fillRect (....);
fillOval (....);

If you want to have different colors for each of your shapes then you must make sure that you call g.setColor before you draw the shape. I recommend going through and playing around with the above shapes a bit because they will be important in many games that you write and will be important in some of the examples that I show you.

Conditionals, Control Statements, and Operators

I will not be talking about any of these subjects here because there isn't any real big difference between those found in Java and those in C++. There will be plenty of examples of them later when I get into more coding related information about specific games.

Images

Image coolImage;
....
coolImage = getImage(getCodeBase(), "dx3d.GIF");
....
g.drawImage(coolImage,0,0,this);

Everyone likes images and it is relatively simple to display them in a java applet. The top line of sample code is our variable declaration which can go at the top of our applet class with our font variable and any others you may have inserted at that location. The second line of code will go in our init method and the last line will go in our paint method.

The syntax of the Java language is very intuitive with many of the method names it uses. For example, by just looking at the code above you can probably get a good idea of what is going on. As I mentioned before, the first line is our variable declaration. The next line involves the loading of our image from it's file. In this case the name of the file is dx3d.GIF. When you are loading images ensure that you have the right capitalization and spelling of the filename. As you start to write bigger applets you are going to be confronted with more and more errors so if you can eliminate some by being cautious in areas like this then your job will be easier. The last line of importance here is responsible for the drawing of the image. You will notice that we are using our graphic context and rather than drawing a string or filling an oval we are drawing an image. The first three parameters are what interest us here. The first parameter is our variable which holds the image that we want to display. Next we have the x and y coordinates of where we want the image to be located on the screen. You will notice that we don't have to give the size of the image at any point. When we load the image in we take on the width and height of the image as it was in the file.

It is a good idea to get familiar with images now because we will come back to images in a bit and add some new wrinkles when we talk about double buffering.

Random Numbers

Random numbers are used quite frequently in game programming as well as regular programming. To get random numbers in Java is a simple task as you can see in the code excerpt below.

public void paint(Graphics g)
{
  int x;
  int y;

  x = (int)(Math.random()*100);
  y = (int)(Math.random()*100);

  g.setColor(Color.red);
  g.drawString("Hello World",x,y);
}

Let's look at the code for the random numbers before we see how they are used in this particular bit of code. You will notice that we make a call to Math.random(). This returns a number between 0 and 1. We then multiply by the range of numbers that we want to have. In the example above I multiply by 100 to give myself a number between 0 and 100. If I wanted a number between 1 and 100 I would multiply by 99 and then add 1. The reason that works is because the multiplication by 99 gives me a number between 0 and 99 and then I add one to put it in the proper range. The last thing you will notice is the int keyword out in front of the random number code. This is called casting. If you are familiar with C/C++ you have probably seen this concept in action before. For those of you who haven't all that is happening is that I am telling the compiler that I am going to stick a float into an int and I am aware of the fact that I will lose some information by using this code.

The purpose of this applet is really simple. Every time it loads it will randomly place the string "Hello World" on the applet somewhere between 0 and 100 for the x and y coordinates. This may seem fairly bland at the moment, but take note of what we are doing because when we discuss threads we will be able to have text randomly appearing and disappearing on the screen and moving around with only slight modifications to the code above.

Coming Soon!!!

Well that is the end of this article. Hopefully you have learned a bit and are interested in what is to come. Next time I will start talking about threads, double buffering, and how to use the mouse and keyboard. To illustrate these concepts we will also talk about how to program a pong game and some other interesting applets. If you have any questions or comments feel free to email me at kinga@cpsc.ucalgary.ca. By the time you see the next article I will have my web page up and running with example applets that I have discussed as well as additional applets.