Home E-Books Special Effects and Game Development in Java Simpler graphics animation

Special Effects and Game Development in Java(TM) - Simpler graphics animation

by Anibal Wainstein

3.2 Simpler graphics animation

To this point, we have only worked with animations on status windows. Personally I think that these types of effects are irritating when I encounter them on the Internet. Now, we will look at graphics animation, which are the greatest strength with Java applets and what makes them so superior to other special effects technologies such as GIF89 animations, DHTML or JavaScript.

3.2.1 Thread synchronization

As I described to your in section 3.0, you must be very careful when using threads. We will look at an example of this now.
We have so far used the paint() method to draw on the applet screen. This method is automatically called by the program thread (the main thread) when the screen needs to be updated. Now that we have two threads and we will begin animating the applet screen, we must call the paint() method a certain number of times per second. The probability is large that the main thread and our self created thread collides with each other. To avoid this, we write the word synchronized after "public" in our overwritten paint() method: 

public synchronized void paint(Graphics g)
{
}
A thread may not enter the method if there already is a thread in there working with the code. This is actually everything we need to see to that our applet does not crash because of thread collisions.

3.2.2 How to stop gray flimmering in an applet by overwriting the update() method

If we are going to make animations with the paint() method, then we must also overwrite the update() method. This method is sometimes called by the web browser before updating the applet screen, in order to clear it (using gray color). This leads to gray flimmering when you animate with the paint() method. Therefore it must be put out of action with the following lines:

public synchronized void update(Graphics g)
{
    paint(g); }  
Now the update() method will not clear the screen, but call our paint() method instead. As you see this method should also be synchronized.

3.2.3 A graphical text scroller

We will now make an applet that is similar than the one we made in section 3.1.1, but now the text will be scrolled in the applet screen.
Make a copy of the statusscroller.java file from section 3.1.1 and change the methods init() and run() to the following content: 

public void init()
{
    message="Basic Course in Special Effects and ";
message+="Game Development in Java(TM)"; }
public void run() {
    while (true)
    {
        update(getGraphics());
        try {Thread.sleep(50);}
        catch(InterruptedException e) {}
    } }

There are no strange things in this init() method. However we have now remade our run() method so that it uses the new updating technique. We are now calling the update() method 20 times per second (using a pause of 50 milliseconds). As argument we send the Graphics object, which is connected to the applet screen and that you can get with the getGraphics() method. This method will in turn call the paint() method, which looks like this:

public int x=100;
public synchronized void paint(Graphics g) {
    //Paint the screen black.
    g.setColor(Color.black);
    g.fillRect(0,0,100,20);
    //Draw the message using white paint starting //from position "x".
    g.setColor(Color.white);
    g.drawString(meddelande,x,12);     //Check that the "x" position for the message //is not less than x=-400. If it is, then //set "x" to the position 100 (this will make the //text invisible).
    if (x<-400) x=100;     //Decrease "x" with 1 so that the text moves //to the left.
    x--; }

Please note that we have added the declaration of the new applet variable "x", over the declaration of "animationthread" and "message", which already existed in the code from the old example. This variable will store the text horizontal position (x-position), even after the paint() method has been called. This position will begin with 100 and end with -400. Because the applet screen being only 100 pixels wide, the text will not be visible at the beginning, but it will be moving slowly to the left until it disappears from sight. The variable "x" will then have the value -400 pixels and then it is time to start over again. This is what the "if" statement is used for.

The effect the variable "x" has on the scrolling text's position. 

You may be wondering why I added 12 pixels to the y-position of the string? As we said in section 2.1.4, the text is being drawn from the base line and upwards. Since it is a 12 dot font, I move the text by 12 pixels. Unfortunately this trick will not work with larger fonts, but we will look at a solution later. Look at the text scroller by clicking here.

You will probably notice that the text is flimmering a bit. In the upcoming chapter 4, we will look at how you can remove this using the well known double buffering technique.

 

 


Next Page >>