Beginner game

[Karl Nilsson]

hey, im trying to make an arcade subhunt game, but i have mastered only the basics of java (even though i know C++ & VB)
i know how to use the key event, but not how to move the image
also, how do you initialize a variable to contain the positions of the left, right, top,& bottom of the image?

[Nathan Pruett]

To do animation, you are going to need to have a component to draw the animation on, like a JPanel if you are doing this in Swing, or a Canvas if you're using AWT. Override the paintComponent() method of the JPanel, or the paint() method of the canvas and do all your drawing in this method. You also need a thread that is updating the position or states of your non-player-controlled items and calling calling repaint() on the component at some specified rate. Have variables for storing the x and y locations of the player controlled item, and base where this image is painted in the paint() or paintComponent() method on these variables. Update these variable in the keyListener, like you are probably doing now. Have the existing thread handle the repainting for you.

If the animation is too flickery, you can do things like override the update method and add double buffering.

Hopefully this gives you some idea of what to do... If you need more help on any of this, please post again.

[Karl Nilsson]

i understand most of the concepts, but i need examples of code!
heres my current source, if you want to point out any flaws, and where to put the threads, canvas, etc

 /*Karl's subhunt java game*/

import java.awt.*;
import java.awt.event.*;
import java.applet.Applet;

public class MoveShip extends Applet implements KeyListener{
//private Image ship=getImage(getDocumentBase(),"ship.gif");
int shipLeft;
int shipRight;
int shipTop;
int shipBottom;
public void init()
{
requestFocus();//get the focus for pushing keys
addKeyListener(this);//add the listener for typed keys
ship.setVisible(true);
shipLeft=Ship.Left;
shipTop=Ship.Top;
shipBottom=ship.Top+Ship.Height;
shipRight=ship.Left+Ship.Width;
}

public void keyPressed(KeyEvent e)
{
int arrowPushed=e.getKeyCode();

if(arrowPushed==KeyEvent.VK_LEFT)
{
Ship.setLocation(shipLeft-10,shipTop);
//update variables
shipLeft=Ship.Left;
shipRight=ship.Left+Ship.Width;
repaint();
}
else if(arrowPushed==KeyEvent.VK_RIGHT)
{
Ship.setLocation(shipLeft+10,shipTop);
//update variables
shipLeft=Ship.Left;
shipRight=ship.Left+Ship.Width;
repaint();
}
else if(arrowPushed==KeyEvent.VK_UP)
{

}
else if(arrowPushed==KeyEvent.VK_DOWN)
{

}
repaint();
}
public void keyTyped(KeyEvent e)
{
}
public void keyReleased(KeyEvent e)
{
}

public void paint(Graphics g)
{
Graphics2D g2 =(Graphics2D)g;
g.drawImage(ship,10,10,this);
Rectangle Ship=new Rectangle(100,110,60,10);
}
} 

[Nathan Pruett]

So far, there is no animation required that is not controlled directly by the user (i.e. moving the ship), so a separate thread isn't needed. I just changed a few things to show the general form of moving the image around. Flickering is still pretty bad, so before you're done, you'll probably want to put double buffering in, but I just wanted to give you the 'bare bones' you would need to move the image.

 /*Karl's subhunt java game*/
 
import java.awt.*;
import java.awt.event.*;
import java.applet.Applet;
 
public class MoveShip extends Applet implements KeyListener {
    
    private Image ship;
    private Rectangle shipBounds;
    
    public void init() {
        ship = getImage( getDocumentBase(), "ship.gif" );
        
        // Make sure image is loaded so bounds are calculated correctly.
        MediaTracker mt = new MediaTracker( this );
        mt.addImage( ship, 0 );
        try {
            mt.waitForAll();
        } catch ( InterruptedException x ) {
            x.printStackTrace();
        }
        
        int width = ship.getWidth( this );
        int height = ship.getHeight( this );
        shipBounds = new Rectangle( ( getSize().width - width ) / 2,
                ( getSize().height - height ) / 2, width, height );
        
        addKeyListener(this); //add the listener for typed keys
    }
    
    public void start() {
        requestFocus(); //get the focus for pushing keys
    }
    
    public void keyPressed( KeyEvent e ) {
        
        int arrowPushed = e.getKeyCode();
        
        // update ship location
        if ( arrowPushed == KeyEvent.VK_LEFT ) {
            shipBounds.x -= 10;
        } else if ( arrowPushed == KeyEvent.VK_RIGHT ) {
            shipBounds.x += 10;
        } else if ( arrowPushed == KeyEvent.VK_UP ) {
            shipBounds.y -= 10;
        } else if ( arrowPushed == KeyEvent.VK_DOWN ) {
            shipBounds.y += 10;
        }
        
        // check bounds to make sure it stays in applet.
        if ( shipBounds.x < 0 ) {
            shipBounds.x = 0;
        } else if ( shipBounds.x + shipBounds.width > getSize().width ) {
            shipBounds.x = getSize().width - shipBounds.width;
        }
        
        if ( shipBounds.y < 0 ) {
            shipBounds.y = 0;
        } else if ( shipBounds.y + shipBounds.height > getSize().height ) {
            shipBounds.y = getSize().height - shipBounds.height;
        }
        
        repaint();
    }
    
    public void keyTyped( KeyEvent e ) {}
    public void keyReleased( KeyEvent e ){}
    
    public void paint( Graphics g ) {
        g.drawImage( ship, shipBounds.x, shipBounds.y, this );
    }
} 

[Karl Nilsson]

thank you!
i understand most of the code
but, i don't get this:

 MediaTracker mt = new MediaTracker( this );        mt.addImage( ship, 0 );
try {
mt.waitForAll();} 
catch ( InterruptedException x )
{ x.printStackTrace(); } 

what does a media traker do
if i had to guess, i would say it has something to do with the image
also, could i use a timer instead of a thread for moving the subs & depth charges?
but if i had to use a thread, would i need one for each object?
as you can tell, im pretty new to java (and frustrated! )
[ February 05, 2004: Message edited by: Karl Nilsson ]

[Nathan Pruett]

All MediaTracker does is make sure the image is loaded. Usually java tries to load an image from a file when it is first displayed. This can cause animation to start off badly if you have a big image and you are redrawing the screen. I used it because the image wasn't loaded yet in the init() method, and I needed to get the width and height of the image to calculate the size of the rectangle correctly in the lines afterward. If the image isn't loaded yet, you would just get 0 as the width and height of the image.

Yes, you can use a Timer (Timers actually use Threads behind the scenes). You don't need a thread for each object you want to animate (you could, but this would be overkill), you only need to have an update() type of method on each of these objects to move them one more "step", update their image, etc. Then just have one main thread (or timer) that calls the update() method on each object and then repaints the screen.

A classic "bouncing ball" animation is a good example of this -

import java.awt.*;
import java.applet.Applet;
 
public class MoveBall extends Applet implements Runnable {
    
    private Ball ball;
    private Thread animationThread;
    private volatile boolean alive = true;
    private volatile boolean paused = true;
    
    public void init() {
        ball = new Ball();
        animationThread = new Thread( this );
        animationThread.start();
    }
    
    public void start() {
        paused = false;
    }
    
    public void run() {
        while ( alive ) {
            if ( !paused ) {
                ball.update();
                repaint();
            }
            try {
                Thread.sleep( 80 );
            } catch ( InterruptedException x ) {
                x.printStackTrace();
            }
        }
    }
    
    public void paint( Graphics g ) {
        ball.paint( g );
    }
    
    public void stop() {
        paused = true;
    }
    
    public void destroy() {
        alive = false;
    }
    
    private class Ball {
        
        private Rectangle bounds;
        
        private Color color;
        
        // Using a Point for speed, but this is not necessarily a "point"
        // speed.x give the number of pixels horizontally the ball will
        // travel in one frame, speed.y the number of pixels vertically
        // the ball will travel in one frame.
        private Point speed;
        
        public Ball() {
            bounds = new Rectangle( ( getSize().width - 5 ) / 2, 
                    ( getSize().height - 5 ) / 2, 10, 10 );
            color = Color.red;
            speed = new Point( 8, 5 );
        }
        
        public void update() {
            bounds.x += speed.x;
            bounds.y += speed.y;
            
            // Make sure ball stays in bounds of parent applet.
            // Since this is an inner class the "getSize()" refers to the
            // outer applet class's getSize() method.
            if ( bounds.x < 0 || bounds.x + bounds.width > getSize().width ) {
                speed.x = -speed.x; // reverse direction
                bounds.x += speed.x;
            }
            
            if ( bounds.y < 0 || bounds.y + bounds.height > getSize().height ) {
                speed.y = -speed.y;
                bounds.y += speed.y;
            }
        }
        
        public void paint( Graphics g ) {
            g.setColor( color );
            g.fillOval( bounds.x, bounds.y, bounds.width, bounds.height );
        }
    }
} 

[Karl Nilsson]

i got it to compile so far, but the image doesn't appear
this is a giant problem, but i know i am overlooking something
here's the code so far:

/*Karl's subhunt java game*/

import java.awt.*;
import java.awt.event.*;
import java.applet.*;

public class MoveShip extends Applet implements KeyListener{
private Image ship;
private Rectangle shipBounds;

public void init()
{
ship=getImage(getDocumentBase(),"ship.gif");
requestFocus();//get the focus for pushing keys
//media tracker makes sure the image is loaded correctly
MediaTracker mt = new MediaTracker( this );
        mt.addImage( ship, 0 );
        try {            
mt.waitForAll();        
} 
catch ( InterruptedException x )
{
x.printStackTrace();
        }
addKeyListener(this);//add the listener for typed keys
//declare variables for the ship's position
int width = ship.getWidth( this );
        int height = ship.getHeight( this );
Rectangle shipBounds=new Rectangle(( getSize().width - width ) / 2,( getSize().height - height ) / 2, width, height );
}

public void keyPressed(KeyEvent e)
{
int arrowPushed=e.getKeyCode();

if(arrowPushed==KeyEvent.VK_LEFT)//if the left arrow is pushed
{
//update variables
shipBounds.x -= 10;
}
else if(arrowPushed==KeyEvent.VK_RIGHT)//if the right arrow is pushed
{
shipBounds.x += 10;

}
else if(arrowPushed==KeyEvent.VK_UP)//if the up arrow is pushed
{

}
else if(arrowPushed==KeyEvent.VK_DOWN)//if the down arrow is pushed
{

}
//Keeps the ship in the applet area
if(shipBounds.x+shipBounds.width>getSize().width)
{shipBounds.x=getSize().width-shipBounds.width;}
else if(shipBounds.x<0)
{shipBounds.x=0;}
repaint();
}
public void keyTyped(KeyEvent e)
{
}
public void keyReleased(KeyEvent e)
{
}

public void paint(Graphics g)
{
Graphics2D g2 =(Graphics2D)g;
g.drawImage(ship,shipBounds.x,shipBounds.y,this);//draw the ship
}
}

[Nathan Pruett]

Where is your image stored? The way you are loading it -

getImage(getDocumentBase(),"ship.gif");

means "load the image named [i]ship.gif[/url] from the same directory as the HTML page that launched this applet."

[Karl Nilsson]

i tried to se if the rectangle was outside of the applet area, and after a few minutes, i somehow managed to get the image to appear!
and even better, it moves!
the only problem i see (only an inconvenience) is you have to click on the applet before you can move the ships
i don't know if this is fixable
now i am trying to be able to launcha torpedo
the first question i have is what is the keycode for the ctrl key is
also, i am having trouble making an array of invisible torpedoes that will appear whenever i push the control key
here's the code so far:

/*Karl's subhunt java game*/

import java.awt.*;
import java.awt.event.*;
import java.applet.Applet;

public class MoveShip extends Applet implements KeyListener{
private Image ship;
private Rectangle shipBounds;
private int width;
private int height;
private int bombNum;
private Image bomb[bombNum];
public void init()
{
bombNum=0;
//make the images appear
ship=getImage(getDocumentBase(),"ship.GIF");
bomb[bombNum]=getImage(getDocumentBase(),"bomb.GIF");
requestFocus();//get the focus for pushing keys
//media tracker makes sure the image is loaded correctly
MediaTracker mt = new MediaTracker( this );
        mt.addImage( ship, 0 );
        try {            
mt.waitForAll();        
} 
catch ( InterruptedException x )
{
x.printStackTrace();
        }
addKeyListener(this);//add the listener for typed keys
//declare variables for the ship's position
width = ship.getWidth( this );
        height = ship.getHeight( this );
setBackground(Color.cyan);
//make sure the 1st bomb is dropped
shipBounds=new Rectangle(( getSize().width - width ) / 2,( getSize().height - height ) / 2, width, height );
}

public void keyPressed(KeyEvent e)
{
int arrowPushed=e.getKeyCode();

if(arrowPushed==KeyEvent.VK_LEFT)//if the left arrow is pushed
{
//update variables
shipBounds.x -= 10;
}
else if(arrowPushed==KeyEvent.VK_RIGHT)//if the right arrow is pushed
{
shipBounds.x += 10;

}
else if(arrowPushed==KeyEvent.VK_UP)//if the up arrow is pushed
{
shipBounds.y -= 10;
}
else if(arrowPushed==KeyEvent.VK_DOWN)//if the down arrow is pushed
{
shipBounds.y += 10;
}
else if(arrowPushed==KeyEvent.VK_Ctrl)
{
bombNum++;
bomb[bombNum].setVisible(true);
}
//Keeps the ship in the applet area
if(shipBounds.x+shipBounds.width>getSize().width)
{
shipBounds.x=getSize().width-shipBounds.width;
}
else if(shipBounds.x<0)
{
shipBounds.x=0;
}
if ( shipBounds.y < 0 ) 
{
shipBounds.y = 0;
        }
else if ( shipBounds.y + shipBounds.height > getSize().height )
{
shipBounds.y = getSize().height - shipBounds.height;
}
repaint();
}
public void keyTyped(KeyEvent e)
{
}
public void keyReleased(KeyEvent e)
{
}

public void paint(Graphics g)
{

g.drawImage(ship,shipBounds.x,shipBounds.y,this);//draw the ship
}
}

is there any way to just add an attachement to the post, because it gets annoying having to copy & paste all the time
[ February 09, 2004: Message edited by: Karl Nilsson ]

[Nathan Pruett]

Good job getting the image to display...

Having to click on the applet to get control should be taken care of by requestFocus(), however, requestFocus() has to be called after the component is visible, so you'll need to add a ComponentListener and call requestFocus() in the componentShown() method.
The keycode for the CTRL key is KeyEvent.VK_CONTROL. To show and hide torpedoes while the CTRL key is pressed, all you have to do is set a boolean called something like "drawTorpedoes" to true when the CTRL key is pressed( in keyPressed() ), and set it to false when it is released( in keyReleased() ). Then in your paint() method just test for "drawTorpedoes" and actually draw the images of the torpedoes only if "drawTorpedoes" is true.

Nope, sorry, with UBB there's not a way to do an attachment to a thread.

[Karl Nilsson]

now the problem is with one line of code
the compiler won't let me make the bomb visible!

else if(arrowPushed==KeyEvent.VK_CONTROL)
{
bomb.setVisible(true);
}

[Nathan Pruett]

What class is your "bomb"? Only Components have the setVisible() method, and from your previous code it looks like "bomb" is an Image. You'll either need to make a separate class for Bomb that has a setVisible() method, or you'll need to use the set/unset a boolean in the listener, test "if(boolean)" in the paint() method approach I had in my last post.

[Karl Nilsson]

ahh, so repaint() just calls the paint method over again! (Duh)
oh, by the way, have you ever tried making any games Nathan?

[Nathan Pruett]

Pretty much repaint() just calls paint() again... there's some other stuff going on behind the scenes though... First, repaint() is really just a request for the system to paint, it's not like a direct method call. This means, if you call repaint() 5000 times in one second, but the system can only paint at a rate of 200 times per second, paint() is only going to be called 200 times, not 5000 times, which would take longer than a second, and would have tons of repaint requests backed up. Second, repaint() really calls update( Graphics g ), which then calls paint( Graphics g ). You can override both update() and paint() on your components, but not repaint(), because it is a final method. This is because it's setting up actual system resources to do the graphical manipulations needed to draw frames,etc. on the screen based on your OS.

I have programmed lots of simple games (arcade-type games, puzzle games), but haven't really made a website to put them on. A few years ago I used to have a free homepage that had a couple of games on it, but all the ad banners and pop-ups that finally got added by the company hosting it made me take it down. I recently got broadband access and have thought about putting some games up in the personal webspace that is provided with the account, or just going all out, getting a domain name and getting hosted by LunarPages.

[Karl Nilsson]

now, i have tried to make a thread to move the torpedo when the control key is pressed, but i am getting a crapload of errors
i think most of them are bacause the rectangles for the boundaries are declared private, but im not sure
here's the code so far:

/*Karl Nilsson's subhunt java game
e-mail me at [e-mail] for questions and whatnot
this game is freeware; and I have no problem with anyone using it
*/

import java.awt.*;
import java.awt.event.*;
import java.applet.Applet;

public class MoveShip extends Applet implements KeyListener{
private Image ship;//ship picture
private Rectangle shipBounds;//ship's boundaries
private int width;//variables used for the ship's boundaries
private int height;
private int bombNum;//used for the array of torpedoes
private Image bomb;//the torpedo image
private Rectangle bombBounds;//torpedo's boundaries
private int bombHeight;//variables used for the torpedo's boundaries
private int bombWidth;
//threads for non-user controlled objects
//private MoveThread threadBomb
//boolean used to launch a torpedo & paint it
private boolean bombDropped;
public void init()
{
//make the threads for items not controlled by the user
MoveThread threadBomb;
threadBomb=new MoveThread();

//make the images appear
bombNum=0;
ship=getImage(getDocumentBase(),"ship.GIF");
bomb=getImage(getDocumentBase(),"bomb.GIF");
requestFocus();//get the focus for pushing keys
//media tracker makes sure the ship image is loaded correctly
MediaTracker mt = new MediaTracker( this );
        mt.addImage( ship, 0 );
        try {            
mt.waitForAll();        
} 
catch ( InterruptedException x )
{
x.printStackTrace();
        }
//media tracker makes sure the torpedo image is loaded correctly
MediaTracker torpedo = new MediaTracker( this );
        torpedo.addImage( bomb, 0 );
        try {            
mt.waitForAll();        
} 
catch ( InterruptedException x )
{
x.printStackTrace();
        }

addKeyListener(this);//add the listener for typed keys
//set variables for the ship's dimensions
width = ship.getWidth( this );
        height = ship.getHeight( this );
//set variables for the torpedo's dimensions
bombWidth=bomb.getWidth(this);
bombHeight=bomb.getHeight(this);
setBackground(Color.cyan);

//make a rectangle for the bondaries of the ship
//this makes the sub appear in the center of the applet
shipBounds=new Rectangle(( getSize().width - width ) / 2,( getSize().height - height ) / 2, width, height );
//make a rectangle for the boundaries of the torpedo
//this makes the torpedo be in the upper left corner of the sub
bombBounds=new Rectangle(shipBounds.x-bombWidth,shipBounds.y,bombWidth,bombHeight);
}

public void keyPressed(KeyEvent e)
{
int arrowPushed=e.getKeyCode();

if(arrowPushed==KeyEvent.VK_LEFT)//if the left arrow is pushed
{
//move the ship left
shipBounds.x -= 10;
if(! bombDropped)//if the bomb is not fired
{
//move the invisible torpedowith the ship
bombBounds.x-=10;
}
}
else if(arrowPushed==KeyEvent.VK_RIGHT)//if the right arrow is pushed
{
//move the ship right
shipBounds.x += 10;
if(! bombDropped)//if the bomb is not fired
{
//move the invisible torpedowith the ship
bombBounds.x+=10;
}
}
else if(arrowPushed==KeyEvent.VK_UP)//if the up arrow is pushed
{
//move the ship up
shipBounds.y -= 10;
if(! bombDropped)//if the bomb is not fired
{
//move the invisible torpedo with the ship
bombBounds.y-=10;
}
}
else if(arrowPushed==KeyEvent.VK_DOWN)//if the down arrow is pushed
{
//move the ship down
shipBounds.y += 10;
if(! bombDropped)//if the bomb is not fired
{
//move the invisible torpedo with the ship
bombBounds.y+=10;
}
}
else if(arrowPushed==KeyEvent.VK_CONTROL)//if the control key is pushed
{
bombNum++;
bombDropped=true;//paint the bomb
threadBomb.start();//start the thread that moves the torpedo
}
//Keeps the ship in the applet area
if(shipBounds.x+shipBounds.width>getSize().width)
{//if the ship hits the right side
shipBounds.x=getSize().width-shipBounds.width;
}//set the right side of the ship back in the applet area
else if(shipBounds.x<0)
{//if the ship hits the left side
shipBounds.x=0;
}//set the left side of the ship back in the applet area
if ( shipBounds.y < 0 ) 
{//if the ship hits the top
shipBounds.y = 0;
        }//set the top of the ship back in the applet area
else if ( shipBounds.y + shipBounds.height > getSize().height )
{//if the ship hits the bottom
shipBounds.y = getSize().height - shipBounds.height;
}//set the bottom of the ship back in the applet area

repaint();//redraw all the images
}
//you have to include these 2 methods eith the keyPressed
public void keyTyped(KeyEvent e){}
public void keyReleased(KeyEvent e){}
public void paint(Graphics g)
{

g.drawImage(ship,shipBounds.x,shipBounds.y,this);//draw the ship
if(bombDropped)//if the control key is pressed
{
g.drawImage(bomb,bombBounds.x,bombBounds.y,this);//draw the torpedo
}
}
}
//here's the code for the thread
class MoveThread extends Thread
{

public MoveThread()
{}

public void run()
{
//make the thread run once every 100 miliseconds (1/10th of a second)
Thread.sleep(100);
if((bombBounds.x + bombWidth)>0)//if the bomb has not fully exited the applet area
{
bombBounds.x-=10;//make the bomb move to the left
}
else if((bombBounds.x + bombWidth)<=0)//if the bomb has fully exited the applet area
{
//reset the bomb's position and make it invisible
bombBounds.x = shipBounds.x-bombWidth;
bombBounds.y = shipBounds.y;
bombDropped=false;
repaint();
}
}

}

[Karl Nilsson]

hey, got the thread to work!
now i just need to get enemy subs and a score and other stuff
ill post later, when i start experimenting!

[Karl Nilsson]

now i'm trying to make the ship "float" instead of making sharp translations
to do this, im using 2 variables to hold the position of the final destination, and using the thread to move the ship a few twips per cycle until the ship is at its destination.
i will post again tommorrow when i have problems (and i know i will)